Hi,
I am working on a complex page and one of the WebDropDowns triggers the values in another WebDropDown. When a value is selected in the first dropdown, the client-side handler will call the loadItems function of the second dropdown to retrieve the values from the server.
The default behavior of the second dropdown is to load the new values and not change the selected values. I would like to have the first item of the new list selected. I tried selecting the new values using a couple of ways (in Javascript) without success. And then I found out that it is caused by the delay in retrieving the new values. What happens is the selection happened before the new values arrives the client-side, so one of the values from the old list was selected.
I am wondering if there is any type of notification (event or something like that) that will let me know I can go ahead and make a selection. Or alternatively if I can force the selection of the first value in the new list, it will work too.
I have built a simple page to demonstrate what I am trying to do. (Please drop .txt from the attachment to see the files, I can't unload a .zip)
There are two dropdowns in the page, and in the first dropdown I have the values {0, 1, 2, 3}, which will trigger {000, 001, 002} in the second dropdown if 0 is selected, {101, 101, 102} if 1 is selected, and so on.
In the server-side event WebDropDown2_ItemsRequested, which handles the on-demand call, I have added a randomize 0 to 1 sec delay . On the client-side, the event that handles the first dropdown selection will select a value in the second dropdown 0.5 sec after calling loadItem (using using setTimeout). There are also two commented functions that will make the selection immediately after calling loadItems to be used for additional testing. Using the current function, half the time you'll see the item being selected from the correct list, and half the time you'll see the item being selected from the list that belongs to the previous selection.
I basically build my page using the example in here: https://ko.infragistics.com/samples/aspnet/drop-down/cascadeUnder WebDropDown -> Cascade. What is being shown there is almost perfect except that I wanted the State to be updated immediately after a new Country is being selected. In this example, it is possible to submit a page with USA and Alberta selected (which does not make sense to me of course).
I'd appreciate any thoughts on this.
Thanks.
FT.
Hi Angel,
Thanks for the suggestion. I've tried your both your ideas, got closer but still not quite there yet.
I first tried using the AJAX client-side event (I've attached the modified code). It seems like the dropdown does not trigger the endRequest event. If you try my attached example, the selection of the first dropdown will not make a selection in the second dropdown. I have added a button just to trigger a postback. If I click on this button, the endRequest event fires and I can get an item in the second dropdown selected.I thought the AutoPostback property on the dropdown might help, it turns out that I'll get two postbacks from making a selection on the first dropdown (presumably one from just making a selection and the second one from the loadItem call). I get nothing loaded in the second dropdown. When I debug the page in VS, sometimes I get the selected value as the parameter in the ItemRequested event, sometimes I get null. I suspect this is a timing/synchronization issue.
I am wary of making selection in the Webdropdown on the server-side due to some bad experience I had with that in the past. I normally determine what should be selected on the server-side and write client-side Javascript to do that (Sounds stupid, but worked for me). I was not able to fully select an item on the server side using the following code added to the end of ItemRequested event:
if (WebDropDown2.SelectedItem != null){ WebDropDown2.SelectedItem.Selected = false;}WebDropDown2.Items[2].Selected = true;WebDropDown2.SelectedItemIndex = 2;WebDropDown2.CurrentValue = WebDropDown2.Items[2].Text;WebDropDown2.SelectedItem = WebDropDown2.Items[2];//WebDropDown2.SelectedItem.Activated = true;
I can get an item selected in the list of dropdown (the one that expands and collapses) but I can't get value in the textbox changed. Note that I have the last line commented, it gives me an error (NullReferenceException, perhaps that's issue?) if I uncomment that.
Any ideas?
Thanks.FT.
One approach would be have the initial selection on the server, done in the ItemsRequested event handler. Set the Selected property of the item to "True".
Another option would be to handle the "endRequest" client-side event, which is part of the MS AJAX library:
http://msdn.microsoft.com/en-us/library/bb386417.aspx
Hope it helps,
Angel