Geek Answers Handbook

Running Javascript after the selected control value is set

Simple ASP.NET application.

I have two drop-down controls. In the first case, I have a JavaScript onChange event. JavaScript includes the second drop-down list and removes the value from it (the value selected in the first drop-down list). If they select the empty first value of the drop-down list, then the second drop-down menu will be disabled (and the reset options).

I also have code in the OnPreRender method that will enable or disable the second drop-down list depending on the value of the first drop-down list. This means that the value of the first drop-down list can be selected in the code (loading user settings).

My problem:

  • The user selects something in the first drop-down list. The second drop-down list will be available through JavaScript.
  • They then modify the third drop-down list that initiates the sending of the message. After returning the message, the drop-down lists are in the correct state (the first value is selected, the second drop-down menu is on).
  • If they then click the "Back" button, the second drop-down list will no longer be included, although it should be, because something is selected in the first drop-down list.

I tried to add a start-up script (which will set the correct state of the second fall down) through ClientScript.RegisterStartupScript , however, when that succeeds, the first drop-down list has selectedIndex of 0 , and not what it really is. I assume that the selection value will be set after my script runs (but still does not call the onChange script).

Any ideas on what to try?

+7
javascript
source share
2 answers
 <%@ Page Language="C#" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <script runat="server"> protected void indexChanged(object sender, EventArgs e) { Label1.Text = " I did something! "; } </script> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title>Test Page</title> </head> <body> <script type="text/javascript"> function firstChanged() { if(document.getElementById("firstSelect").selectedIndex != 0) document.getElementById("secondSelect").disabled = false; else document.getElementById("secondSelect").disabled = true; } </script> <form id="form1" runat="server"> <div> <select id="firstSelect" onchange="firstChanged()"> <option value="0"></option> <option value="1">One</option> <option value="2">Two</option> <option value="3">Three</option> </select> <select id="secondSelect" disabled="disabled"> <option value="1">One</option> <option value="2">Two</option> <option value="3">Three</option> </select> <asp:DropDownList ID="DropDownList1" AutoPostBack="true" OnSelectedIndexChanged="indexChanged" runat="server"> <asp:ListItem Text="One" Value="1"></asp:ListItem> <asp:ListItem Text="Two" Value="2"></asp:ListItem> </asp:DropDownList> <asp:Label ID="Label1" runat="server"></asp:Label> </div> </form> <script type="text/javascript"> window.onload = function() {firstChanged();} </script> </body> </html>

Edit: replaced all code. This should work even in your user control. I believe that Register.ClientScriptBlock does not work, because the code that you write in this block is executed before calling window.onload. And, I assume (I'm not sure about this) that DOM objects do not have their values ​​set at that time. And that is why you get selectedIndex, as always, 0.

+2
source share

If the second drop-down menu is initially enabled via javascript (I assume this is during the javascript exchange, as you did not specify), then clicking the back button to reload the previous postback will never turn it on.

Mixing ASP.NET with classic javascript can be hairy. Perhaps you should take a look at the ASP.NET Ajax implementation (or a third-party AjaxPanel control if you are forced to use an older version of ASP.NET). Those will give you the behavior you want with pure C #, without forcing you to resort to hacking javascript hacking.

+3
source share

More articles:


All Articles