Saturday, March 24, 2012

CascadingDropDown SelectedIndexChanged FormView

Hi all,

I just found out that if I put a cascadingDropDownList with some dropDownLists, that have the OnSelectedIndexChanged event, inside a FormView, that event doesn't fire at the first time for the first dropdownlist.

This code works fine:

Ilha:
<asp:DropDownList ID="ddlIlhas" runat="server" OnSelectedIndexChanged="ddlIlhas_SelectedIndexChanged" AutoPostBack="true">
</asp:DropDownList>
<br /
Concelho:
<asp:DropDownList ID="ddlConcelhos" runat="server" OnSelectedIndexChanged="ddlConcelhos_SelectedIndexChanged" AutoPostBack="true">
</asp:DropDownList>
<br /
<atlasToolkit:CascadingDropDown ID="ddlPanel" runat="server">
<atlasToolkit:CascadingDropDownProperties ID="propIlha" Category="Ilha" LoadingText="[A carregar...]" PromptText="Escolher..." ServiceMethod="GetIlhas" TargetControlID="ddlIlhas" ServicePath="/EDA.SGI.Website/WebService.asmx" />
<atlasToolkit:CascadingDropDownProperties ID="propConcelho" Category="Concelho" LoadingText="[A carregar...]" ParentControlID="ddlIlhas" PromptText="Escolher..." ServiceMethod="GetConcelhosByIlha" ServicePath="/EDA.SGI.Website/WebService.asmx" TargetControlID="ddlConcelhos" />
</atlasToolkit:CascadingDropDown>
</InsertItemTemplate>
But if I put it inside an InsertItemTemplate of a FormView, when I change the selected index of the first DDL at the first time, it doesn't go to theddlIlhas_SelectedIndexChanged handler. Anyone has any idea of what is going on here?Hi i am having exactly the same problem. I've been investigating this problem and it only seems to happen when used within the FormView. I'm quite new to the ajax control toolkit but if i find a solution i will let you know. Hope this helps.
The syntax above (CascadingDropDownProperties) indicates that you're using a quite old build of both ASP.NET AJAX and the AJAX Control Toolkit. Please try upgrading to ASP.NET AJAX 1.0 and Toolkit 10301, both of which are available fromhttp://asp.net/ as we've made numerous improvements since the old builds you seem to be using. Thank you!

Hi i am using the latest build and the problem still exists. I have uploaded the sample website with a few additions to show you:

http://www.flixon.com/AjaxControlToolkit.rar

Within the CascadingDropDown folder in the sample website there's now two new files:

Test.aspx - Without FormView (SelectedIndexChanged works fine)

Test2.aspx - With FormView (SelectedIndexChanged doesn't fire on first change)

Appreciate if you could help. Thanks


Sorry, I haven't managed to track this down all the way and I've run out of time just now. It definitely seems to be related to CascadingDropDown somehow since adding a plain DropDownList doesn't show the problem. I've tried commenting out the two event handlers in CascadingDropDownBehavior, but that didn't seem to do the trick. A quick web search turned up the following two articles which seem like they may provide a clue:

http://www.mikepope.com/blog/displayblog.aspx?permalink=1629

http://www.manuelabadia.com/blog/PermaLink,guid,a2abee08-bb7f-4fe5-8a24-6e56da99172a.aspx

If nothing else, pleaseopen a work item to track this bug. Thank you!


Hi, i added a work item a few weeks back:

http://www.codeplex.com/AtlasControlToolkit/WorkItem/View.aspx?WorkItemId=9454

Nothing has been posted yet. I will take a look at the posts you provided hopefully later today. Thanks for your help.


Hi, i've had a look but this goes straight over my head. If someone does find a solution then that would be great.

FYI, I just updatedwork item 9454 with the following notes:

Ted and I looked into this some just now. What appears to ultimately be the problem is that CascadingDropDown (and, in fact, ExtenderBase from which it derives) isn't seeing its CascadingDropDown_ClientStateValuesLoaded/Page_PreLoad method getting called when placed in a FormView's template. That ends up causing some different behavior due to the contents of the DropDownList being empty at first. The following page goes into some more detail about how the page lifecycle is different within a template and so this is probably a more general issue we should review for the Toolkit as a whole:http://msdn2.microsoft.com/en-us/library/ms178472.aspx.

What's good is that adding the following as the contents of the DropDownList seems to work around the problem for now (it's an empty ListItem that'll get replaced by CascadingDropDown once it populates the list): "<asp:ListItem></asp:ListItem>". With that, the sample code in Test2.aspx in the RAR fromhttp://forums.asp.net/thread/1671609.aspx works as expected.


Hi David

Thanks for your attention with this problem thus far. I am having a similar problem to this, but wherever I search, I get redirected back to this posting, so I'm adding my comments here. I am trying to use a set of 4 CascadingDropDowns to select a car model (sound familiar?Smile ) . When the user selects the final drop-down, I want to create a set of check boxes based on the last drop-down's value. I am not using a FormView, just a simple form. The SelectedIndexChanged event is not firing straight away. I have another field in the form (vehicle registration date), on which the check box set also depends, so I have an OnTextChanged event set for this too. With me so far? Now, if I fill the drop-downs in a cascade using a modal window (all of which seems to work nicely), the SelectedIndexChanged event is not firing on the last drop-down. If, however, after this, I then change my text box value, the SelectedIndexChanged event for the drop-down chooses this moment to fire, followed by the OnTextChanged event for the text box. It's as if the event is getting held up or saved for later use. Is this all part of the same problem? Is there a work around I can use?

Here's my page code:

<span class="oneline" id="spDVLALookup" runat="server" visible="false"> <asp:Button ID="btnDVLALookup" Text="DVLA Lookup" runat="server" Visible="false" /></span><span class="oneline"> <span class="txtName">Manufacturer: </span><asp:DropDownList ID="ddManuf" runat="server" Width="300"> </asp:DropDownList></span><br /><span class="oneline"> <span class="txtName">Range: </span><asp:DropDownList ID="ddRange" runat="server" Width="300"></asp:DropDownList></span><br /><span class="oneline"> <span class="txtName">Model: </span><asp:DropDownList ID="ddModel" runat="server" Width="300"></asp:DropDownList></span><br /><span class="oneline"> <span class="txtName">Derivative: </span> <asp:DropDownList ID="ddDeriv" AutoPostBack="true" OnSelectedIndexChanged="ddDeriv_SelectedIndexChanged" runat="server" Width="300"> <asp:ListItem></asp:ListItem> </asp:DropDownList></span><br /><span class="oneline"> <span class="txtName">Date First Registered: </span> <asp:TextBox ID="tb1stRegDate" runat="server" Width="300" AutoPostBack="true" OnTextChanged="tb1stRegDate_TextChanged" /></span><br /><cc1:CascadingDropDown ID="CascadingDropDown1" runat="server" TargetControlID="ddManuf" Category="Manuf" PromptText="-- Manufacturer --" LoadingText="[Loading manufacturers...]" ServicePath="~/Services/CAPData.asmx" ServiceMethod="GetData" /><cc1:CascadingDropDown ID="CascadingDropDown2" runat="server" TargetControlID="ddRange" Category="Range" PromptText="-- Range --" LoadingText="[Loading ranges...]" ServicePath="~/Services/CAPData.asmx" ServiceMethod="GetData" ParentControlID="ddManuf" /><cc1:CascadingDropDown ID="CascadingDropDown3" runat="server" TargetControlID="ddModel" Category="Model" PromptText="-- Model --" LoadingText="[Loading models...]" ServicePath="~/Services/CAPData.asmx" ServiceMethod="GetData" ParentControlID="ddRange" /><cc1:CascadingDropDown ID="CascadingDropDown4" runat="server" TargetControlID="ddDeriv" Category="Deriv" PromptText="-- Derivative --" LoadingText="[Loading derivatives...]" ServicePath="~/Services/CAPData.asmx" ServiceMethod="GetData" ParentControlID="ddModel" />
 Here's the code to enable the button at the top: 
// Add the DVLA lookup buttonif (myVt.VIN.Length > 0 || myVt.Registration.Length > 0){ spDVLALookup.Visible =true; btnDVLALookup.Visible =true; btnDVLALookup.OnClientClick ="this.value='Please Wait'; this.disabled=true; DVLALookup(this, '" + myVt.VIN +"', '" + myVt.Registration +"');";}

Here's the JavaScript which does the modal window lookup (this JavaScript is not in the page Head because this page sits in a Master page):

function DVLALookup(button, vin, reg){ aryValues = new Array(); button.disabled = true; button.value = "Please Wait"; var url = "../../ExperianCapData/GetExperianData.aspx?vin=" + vin + "?istration=" + reg; if (navigator.appName != "Netscape") { lleft = (screen.availWidth/2) + 80; ttop = (screen.availHeight/2)-250; } strTemp = window.showModalDialog(url,aryValues,"dialogWidth:400px;dialogHeight:500px;dialogLeft:"+lleft+"px;dialogTop:"+ttop+"px;center:no;resizable:no;status:no;"); button.disabled = false; button.value = "DVLA Lookup"; if (strTemp.length > 0 && document.forms[0].ctl00_main_hfCapCode != null) { document.forms[0].ctl00_main_hfCapCode.value = strTemp; }}

Actually, I've fixed this by putting the value from the modal window (as you might have guessed from the last line of my JavaScript) into a hidden field which fires a OnValueChanged event, which in turn populates the drop-downs with the correctly selected items. I then have a logic check in my SelectedValueChanged method for the final drop-down ("derivative"), which only creates my set of check boxes for the SelectedValueChanged event if the value of the bottom drop-down is different from the one in the hidden field. This allows users to select a derivative manually (i.e. not via the modal window lookup). Also, if the SelectedValueChanged event gets delayed and fired at the same time (well OK just before) the ValueChanged event for my registration date field, it will see that its value is the same as the hidden one, so it won't try to set off the creation of the check boxes.

It's a bit clumsy, but it works. Of course, in the future I might try to split this form into TabPanels or AccordionPanes - although there was a problem with the latter, which I've forgotten. Meanwhile, if anyone can see an obvious flaw in my logic or a better way to do this, or even solve why the drop-down SelectedValueChanged event is getting delayed by one postback, please feel free to comment

Cheers, Mundo

No comments:

Post a Comment