c# - 在 Asp.net HTML 控件中动态获取城市

Question

我有一个国家/地区的 HTML 下拉列表。现在我想使用 ajax 相应地填充城市下拉列表

<select class="form-control" id="ddCountry" runat="server" tabindex="8"></select>

<select class="form-control" id="ddCity" runat="server" tabindex="9"></select>

<script type="text/javascript">
        $('#ddCountry').on('change', function () {

            var storeData = { countryId: this.value }

            $.ajax({
                type: "POST",
                url: "UserRegistration.aspx/GetCities",
                data: JSON.stringify(storeData),
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (data) {
                    alert("The data in list is "+data);
                },
                error: error
            });
        });
    </script>

我在.cs页面上的方法如下:

[WebMethod]
        public static List<CityBO> GetCities(string countryId)
        {
             //returning cities
        }

问题是我能够在 GetCities 方法中获取数据，但无法在 ddCity 列表中显示它，因为它是一个 HTML 控件并且该方法是静态的，所以

ddCity.Items.AddRange(list_of_countries) 不起作用，因为 ddCity 在静态方法中未被识别。请告诉如何填写下拉列表。

Answer 1

您不能在静态方法中访问控件。您需要从 web 方法返回城市列表并使用 javascript 填充下拉列表。在 ajax 的成功方法中编写这样的代码。

success: function (data) {
    fillDropDown(data.d);
}

function fillDropDown(data){
    var html = "";
    for (var i = 0; i < data.length; i++)
    {
          html += "<option value='" + data[i].ValueField+ "'>" + 
                   data[i].TextField+ "</option>";
    }
     $("select[id$=ddlCity]").html(html);
}