Tutorial :jQuery Change Value of ASP.NET AJAX CascadingDropDown



Question:

I can use jQuery to change the value of a CascadingDropDown, but the event that fires which causes the target control's child dropdown to populate with data never happens:

$("#<%= ddlFromCompetition.ClientID %>").change(function() {    var fromValue = $("#<%= ddlFromCompetition.ClientID %>").val();    $("#<%= ddlToCompetition.ClientID %>").val(fromValue); // causes value to change, but child doesn't update  });  

To be clear, ddlFromCompetition and ddlToCompetition are not parent/child. It's the child of ddlToCompetition that does not update using the above code. When selecting ddlToCompetition using the mouse, its child dropdown updates as expected.

I've tried calling $("#<%= ddlToCompetition.ClientID %>").change() to try to force the event to fire, but it doesn't work.


Solution:1

You need the trigger() event

$("#<%= ddlToCompetition.ClientID %>").trigger('change');  

JQuery docs: http://api.jquery.com/trigger/

Also, because the first change event handler for ddlFromCompetition fires in the context of ddlFromCompetition, you should be able to change...

var fromValue = $("#<%= ddlFromCompetition.ClientID %>").val();  

to...

var fromValue = $(this).val();  

Note:If u also have question or solution just comment us below or mail us on toontricks1994@gmail.com
Previous
Next Post »