Cascading AJAX drop down boxes
added: 1/31/2010
Version: 2.30.0
It is often difficult to extract data from AJAX web sites, but cascading AJAX drop down boxes can be especially difficult. You will often need to resort to scripting to handle cascading AJAX drop down boxes properly.
In this article I'll explain how extract data from this AJAX demonstration web page:
http://www.asp.net/ajax/ajaxcontroltoolkit/samples/CascadingDropDown/CascadingDropDown.aspx
First I need to add a form field element for each of the 3 drop down boxes. All of the 3 form fields trigger an AJAX action. The make drop down box needs to wait for the model drop down box and the model drop down box needs to wait for the color drop down box. The color drop down box needs to wait for the message displayed under the drop down boxes.
When an AJAX action is set to wait for another element, it simply waits for the other element to change its content.
When you select a car make, you'll see that the model drop down box briefly changes its content to [Loading models...] and then it lists all the models. The AJAX action waits until the content changes, so it will start processing the model drop down ox immediately after it changes to [Loading models...] which is obviously too early.
I need to add a wait script that tells the AJAX action to wait until the content changes, but keep waiting if the content changes to [Loading models...]. The following lines of code implements this logic:
if(!args.OldContent.Equals(args.NewContent) && !args.NewText.Equals("[Loading models...]"))
return true;
(see the attached demo project for the entire script)
I can do the same thing for the model and color drop down boxes.
Sometimes it can be difficult to see the different stages of an AJAX element. For example, the [Loading models...] text will appear very briefly and you may not have time to read the text properly. To help with this problem you can monitor the content of a particular element. You do that by right clicking on the element and selecting Monitor selection from the context menu.
Download demo project and data extract CascadingDD.rar