Manera correcta de desencadenar programáticamente un evento de cambio de ASP.net CascadingDropDown usando JavaScript

Margen

<asp:ScriptManager runat="server" />
Country Code
<asp:TextBox ID="CoutryCodeTextBox" runat="server" onblur="selectCountry(this.id);">
</asp:TextBox>

<asp:DropDownList ID="CountryDropDownList" runat="server">
</asp:DropDownList>

<ajaxToolkit:CascadingDropDown
    ID="CountryDropDownListCascadingDropDown" runat="server"
    TargetControlID="CountryDropDownList"
    Category="Country"
    ServiceMethod="GetCountries"
    ServicePath="~/CountryData.asmx"
    LoadingText="Loading ..."
    PromptText="SELECT">
</ajaxToolkit:CascadingDropDown>


<asp:DropDownList ID="CityDropDownList" runat="server">
</asp:DropDownList>
<ajaxToolkit:CascadingDropDown
    ID="CityDropDownListCascadingDropDown" runat="server"
    ParentControlID="CountryDropDownList"
    TargetControlID="CityDropDownList"
    Category="City" ServiceMethod="GetCities"
    ServicePath="~/CountryData.asmx"
    LoadingText="Loading ..."
    PromptText="SELECT">
</ajaxToolkit:CascadingDropDown>

Servicio web (~ / CountryData.asmx)

[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
[System.ComponentModel.ToolboxItem(false)]
[ScriptService]
public class CountryData : System.Web.Services.WebService
{
    [WebMethod]
    public CascadingDropDownNameValue[] GetCountries(string knownCategoryValues, string category)
    {
        List<CascadingDropDownNameValue> values = new List<CascadingDropDownNameValue>();

        values.Add(new CascadingDropDownNameValue("United States", "US"));
        values.Add(new CascadingDropDownNameValue("Canada", "CA"));

        return values.ToArray();
    }

    [WebMethod]
    public CascadingDropDownNameValue[] GetCities(string knownCategoryValues, string category)
    {
        StringDictionary kv = CascadingDropDown.ParseKnownCategoryValuesString(knownCategoryValues);
        string country = kv["Country"];

        List<CascadingDropDownNameValue> values = new List<CascadingDropDownNameValue>();

        switch (country)
        { 
            case "US":
                values.Add(new CascadingDropDownNameValue("California", "CA"));
                values.Add(new CascadingDropDownNameValue("New York", "NY"));
                break;
            case "CA":
                values.Add(new CascadingDropDownNameValue("Toronto", "TO"));
                values.Add(new CascadingDropDownNameValue("Montreal", "MO"));
                break;
        }

        return values.ToArray();
    }

}

jQuery

    var selectCountry = function (id)
    {
        var countryCodeTextBox = $("#" + id);
        var countryDropDownList = $("#CountryDropDownList");

        countryDropDownList.val(countryCodeTextBox.val());
        countryDropDownList.change();
    }

La función javascript cambia el valor seleccionado de CountryDropDownList. Sin embargo, el control en cascada CityDropDownList no se completa automáticamente.

¿Cuál es la manera correcta de desencadenar el evento de cambio en el control principal utilizando jQuery para que los controles relacionados se conecten en cascada automáticamente?

Respuestas a la pregunta(1)

Su respuesta a la pregunta