Заполните несколько связанных раскрывающихся списков с помощью JQuery

У меня есть два связанных (связанных) раскрывающихся списка в веб-форме asp.net.

<p>
   <asp:DropDownList runat="server" CssClass="country" ID="ddlCountry" OnSelectedIndexChanged="ddlCountry_SelectedIndexChanged" AutoPostBack="true"></asp:DropDownList>
</p>
<p>
   <asp:DropDownList runat="server" CssClass="city" ID="ddlCity" ></asp:DropDownList>
</p>
<input type="button" class="magicBtn" value="Magic" />

А это сценарий

$(document).ready(function () {

            $(".magicBtn").click(function () {

                var obj = { CountryId: "2", CityId: "3" };
                $(".country").val(obj.CountryId).trigger("change");
                $(".city").val(obj.CityId);
            });

        });

Когда я присваиваю такие значения, появляется только раскрывающееся меню страны, затем заполняется раскрывающееся меню города, однако его значение не отображается. Если я снова нажму на magicBtn, он появится.

Я предполагаю, что как только я нажимаю на кнопку, запускается событие изменения (__ doPstBack), поэтому перед назначением значения города страница обновляется, но параметры извлекаются, затем при втором щелчке параметры готовы, поэтому назначение в порядке. < br>
(На данный момент мне любопытно, как значение присваивается раскрывающемуся списку городов. Я удивлен, когда вижу, что оно заполняется при втором щелчке, поскольку я предполагал, что всякий раз, когда я нажимаю волшебную кнопку , trigger("change") выполнять обратную передачу и присвоение значения города никогда не происходит. Поэтому я подумал, что после первого щелчка выбирается параметр страны, затем приходит второй щелчок, проверяется значение параметра, если такое же, тогда не отправляйте обратную передачу, поэтому он может перейдите к строке ниже, чтобы назначить раскрывающийся список города, однако , когда я проверял это в инструментах разработчика, я увидел, что он выполнял обратную передачу, хотя опция значение страны было таким же. Итак, несмотря на обратную передачу, как назначается раскрывающийся список города? GIF связан с этой проблемой.)

введите здесь описание изображения

Итак, я хочу, чтобы сразу после первого щелчка были выбраны значения параметров и страны, и города.


javascript dropdown jquery asp.net
person ibubi    schedule 01.02.2017    source источник

Ответы (1)


arrow_upward
0
arrow_downward

При первом щелчке метод триггера jquery запускает обратную передачу, запускается событие load страницы, а затем событие selectedIndexChanged раскрывающегося списка. Событие selectedIndexChanged имеет

protected void ddlCountry_SelectedIndexChanged(object sender, EventArgs e)
        {
            ddlCity.Items.Clear();
            FillCityDropdown(ddlCity, Convert.ToInt32(ddlCountry.SelectedItem.Value));
        }

Таким образом, раскрывающийся список стран также заполняется, однако после этого $(".city").val(obj.CityId); назначения, поэтому, поскольку это назначение было до заполнения, оно не работало.

При втором щелчке снова изменение запускает обратную передачу, но теперь, поскольку выбранный индекс раскрывающегося списка страны не изменился, его событие не запускается, поэтому в коде программной части ничего не происходит, однако в раскрывающемся списке города на стороне клиента был заселен, и задание выполнено.

Решение

Решаю проблему вот так

Javascript

$(document).ready(function () {

            $(".magicBtn").click(function () {
                
                var obj = { CountryId: "2", CityId: "3" };
                $(".country").val(obj.CountryId);
                __doPostBack("ddlCountry", obj.CityId);
            });
            
        });

Index.aspx.cs

 string controlName = "";
 string controlArg = "";
 
 protected void Page_Load(object sender, EventArgs e)
 {
     controlName = Request.Params.Get("__EVENTTARGET");
     controlArg = Request.Params.Get("__EVENTARGUMENT");
    //..
 }


protected void ddlCountry_SelectedIndexChanged(object sender, EventArgs e)
{
     ddlCity.Items.Clear();
     FillCityDropdown(ddlCity,   Convert.ToInt32(ddlCountry.SelectedItem.Value));
     if (!string.IsNullOrEmpty(controlArg))
         ddlCity.SelectedValue = controlArg;
}
person ibubi    schedule 16.02.2017