One way around this is to use jQuery to make an AJAX request to the server and update the the second dropdown independenty from the Update Panel. The following paragraphs will illustrate how to do this.
In this example I use a simple WebMethod in the code behind file but using WebAPI or WCF would likely be a more robust solution for a production application.
Here is the markup for the two controls we are binding together:
The data binding for cboCategory takes place when the form loads. The cboType will need to be populated dynamically based on the selected category.
First, we set up an event handler for the cboCategory dropdown by using the jQuery change() method. Next, we get the selected value and pass that to the loadTypeList() function. The loadTypeList function then uses the jquery ajax() method to return the type list from the WebMethod in the code behind file.
That WebMethod looks like this...
Did you notice there is no code serializing the list to JSON? That's because ASP.NET handles this automatically for us. All we have to do is indicate a return type and the method will return valid JSON. Returning List<
Isn't that cool how simple it is to bind client-side controls to server-side controls?