ASP.NET - Установите значение DropDownList и текстовые атрибуты, используя JS

Question

У меня есть элемент управления Dropdownlist на одной из моих страниц ASCX .

<asp:DropDownList ID="demoddl" runat="server" onchange="apply(this.options[this.selectedIndex].value,event)" onclick="borderColorChange(this.id, 'Click')" onblur="borderColorChange(this.id)" CssClass="dropDownBox" DataTextField="EmpName" DataValueField="EmpID">

Моя цель - заполнить этот выпадающий список «EmpID» в качестве атрибута значения и «EmpName» в качестве текстового атрибута.

JS-код для извлечения этих значений «EmpName» и «EmpID»:

$(document).ready(function () 
{
loadSavedFreeTextSearchCombo();
}


function loadSavedFreeTextSearchCombo() {

    var params = {
        loginID: $('#loginID').val()
    };

    var paramsJSON = $.toJSON(params);

    $.ajax({
        type: "POST",
        url: _WebRoot() + "/Ajax/EmpDetails.asmx/GetEmp",
        data: paramsJSON,
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (data) {
            $('#demoddl').empty();
            $('#demoddl').append($("<option></option>").val(0).html("--Employee Names --"));
            $.each(data.d, function (index, value) {
                $('#demoddl').append($("<option></option>").val(value.EmpID).html(value.EmpName));
            });

        },
        error: function () {
            showError("Failed to load Saved Search Data!");

        }
    });

}

Хотя весь код выполняется без каких-либо ошибок (метод EmpDetails.asmx успешно возвращает действительные данные), dropdwonlist не заполняется требуемыми возвращаемыми данными.

Что я делаю не так? Я думаю, что-то не так в моем коде события «успех»

Answer 1

Поскольку вы собираетесь использовать DropDownList идентификатор управления сервером в качестве селектора, необходимо установить ClientIDMode="Static", особенно если вы используете <asp:ContentPlaceHolder> или <asp:Content>, чтобы механизм ASPX не создавал элемент <select>с атрибутом id, содержащим имя заполнителя раскрывающегося списка:

<asp:DropDownList ID="demoddl" runat="server" ClientIDMode="Static"
                  onchange="apply(this.options[this.selectedIndex].value,event)"
                  onclick="borderColorChange(this.id, 'Click')"
                  onblur="borderColorChange(this.id)" 
                  CssClass="dropDownBox" DataTextField="EmpName" DataValueField="EmpID">

Если вы не можете использовать атрибут ClientIDMode="Static" по определенным причинам (например, избегая нескольких элементов <select> с одинаковым идентификатором ), используйтеClientID свойство элемента управления как селектора, т.е. <%= demoddl.ClientID %>:

$.ajax({
    type: "POST",
    url: _WebRoot() + "/Ajax/EmpDetails.asmx/GetEmp",
    data: paramsJSON,
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: function (data) {
        $('#<%= demoddl.ClientID %>').empty();
        $('#<%= demoddl.ClientID %>').append($("<option></option>").val(0).html("--Employee Names --"));

        // recommended to check against undefined here
        $.each(data.d, function (index, value) {
            $('#<%= demoddl.ClientID %>').append($("<option></option>").val(value.EmpID).html(value.EmpName));
        });

    },
    error: function () {
        showError("Failed to load Saved Search Data!");
    }
});