Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

ASP.Net AJAX UpdatePanel Fails to Trigger SelectedIndexChanged Event

I have an ASP.Net RadioButtonList control with AutoPostBack set to true. I also have an OnSelectedIndexChanged function that is called whenever a user changes the selection. Finally, the user is required to provide the information requested for this control, so I have a default selection when the user arrives on the page--

<asp:RadioButtonList ID="rblHighestDegree" runat="server" AutoPostBack="true"
        onselectedindexchanged="rblHighestDegree_SelectedIndexChanged">
   <asp:listitem Runat="server" Text="Master's Degree" Selected="True" />
   <asp:listitem Runat="server" Text="Doctorate" />
</asp:RadioButtonList>

In the code sample above, when the user switches from the default selection (e.g., "Master's Degree") to a different option (e.g., "Doctorate"), then the SelectedIndexChanged event is triggered. Then, if the user changes his mind, and subsequently selects the original default option, the SelectedIndexChanged event is triggered again. This works precisely as intended and expected.

I have a second control that I enable or disable, depending on the selection above, in the code-behind...

<asp:ScriptManager ID="scriptmanager1" runat="server" />
<asp:UpdatePanel ID="updatepanel1" runat="server">
<ContentTemplate>
<asp:RadioButtonList ID="rdlYearsOfStudy" runat="server" Enabled="false">
<asp:listitem Runat="server" Text="Less than 3 years" />
<asp:listitem Runat="server" Text="3 - 4 years" />
<asp:listitem Runat="server" Text="5 - 6 years" />
 </asp:RadioButtonList>
</ContentTemplate>
<Triggers>
  <asp:AsyncPostBackTrigger ControlID="rblHighestDegree" EventName="SelectedIndexChanged" /> 
</Triggers>
</asp:UpdatePanel>

The problem I'm having only occurs only after I placed this second control within an ASP.Net AJAX UpdatePanel to enable an asynchronous postback (as shown above). Once I did this, the original RadioButtonList control will only postback when I select a ListItem that was not selected by default when the user arrived on the page. If the user subsequently selects the original default selection, the postback does not occur.

To clarify, if I postback without placing the applicable second control in an ASP.Net AJAX UpdatePanel, then SelectedIndexChanged works no matter which RadioButtonList ListItem the user selects. On the other hand, after I place a control inside an UpdatePanel to apply the AsyncPostBackTrigger, then the postback only happens for selections of non-default ListItems.

More information that might be relevant is that I'm coding with Microsoft Visual Studio 2008, and the UpdatePanel control that I'm using is part of the Microsoft AJAX Libary (not the ASP.NET AJAX Control Toolkit).

I would appreciate any insight with how to get ASP.Net AJAX to work such that I can get the SelectedIndexChanged event to fire when a user selects either the default or non-default ListItems in the RadioButtonList. For the record, I tried setting the RadioButtonList default selection in the page_load event, but it didn't help.

Thanks in advance for any and all help!

like image 673
cjo30080 Avatar asked Oct 10 '12 23:10

cjo30080


People also ask

How do I add a postback trigger in UpdatePanel?

Find control (no problem) link. CommandArgument = e. VisibleIndex. ToString(); PostBackTrigger trigger = new PostBackTrigger(); trigger.

What is UpdatePanel in Ajax in asp net?

UpdatePanel controls are a central part of AJAX functionality in ASP.NET. They are used with the ScriptManager control to enable partial-page rendering. Partial-page rendering reduces the need for synchronous postbacks and complete page updates when only part of the page has to be updated.

What is trigger in UpdatePanel?

Triggers for a given UpdatePanel, by default, automatically include any child controls that invoke a postback, including (for example) TextBox controls that have their AutoPostBack property set to true.

How many types of triggers are present in UpdatePanel?

Answer: There are 2 types of triggers.


2 Answers

I had the same issue and found that the generated HTML did not have a click handler on the default selection. The other radio buttons in the list all have click handlers to call __doPostBack. So I added this bit of jQuery:

$("#rbl input[checked]").click(function (e)
{
    var id = e.target.id.replace('_', '$');
    setTimeout(function () { __doPostBack(id, ""); }, 0);
});

However, even though the ajax call was now working as expected, the server-side code was still not executing the selectedIndexChanged handler.

Thinking that it might be because the server knows what the default selection is (was) and sees that the posted selection is the same and so thinks the selected index was not changed and so didn't execute the handler.

Then I thought that when one of the other radios was selected, the server should have remembered that through the viewstate. Which caused me to remember that I had viewstatemode="Disabled" on the container of my radiobuttonlist. So I set viewstatemode="Enabled" on the radiobuttonlist and it's now working as expected.

like image 122
Jeff Shepler Avatar answered Oct 04 '22 19:10

Jeff Shepler


Microsoft states that it's by design. They offer 2 workarounds, but both workarounds have issues which may prevent an actual solution.

http://connect.microsoft.com/visualstudio/feedback/details/508710/radiobuttonlist

like image 36
Jim W Avatar answered Oct 04 '22 19:10

Jim W