javascript - 如何从 C# 添加数据到动态添加的下拉列表

Question

我正在创建一个网站，需要从从数据库获取数据的 C# 类将数据添加到下拉列表。

我创建了一个网站，可以使用 jquery 动态添加下拉列表和文本框:

$(document).ready(function () {
        var max_fields = 10; //maximum input boxes allowed
        var wrapper = $(".input_fields_wrap"); //Fields wrapper
        var add_button = $(".add_field_button"); //Add button ID

        var x = 1; //initlal text box count
        $(add_button).click(function (e) { //on add input button click
            e.preventDefault();
            if (x < max_fields) { //max input box allowed
                x++; //text box increment

                $(wrapper).append('<div><select id="ddlCon" >getCars()</select>&nbsp;&nbsp;&nbsp;&nbsp;<input type="text" name="mytext[]"/><a href="#" class="remove_field">Remove</a></div>'); //add input box
            }
        });

        $(wrapper).on("click", ".remove_field", function (e) { //user click on remove text
            e.preventDefault(); $(this).parent('div').remove(); x--;
        })
    });

<div class="input_fields_wrap">
        <button class="add_field_button">Add More Fields</button>
        <div>
            <select id="ddlCon"><option></option></select>&nbsp;&nbsp;&nbsp;&nbsp;<input type="text" name="mytext[]" />
        </div>
    </div>

我尝试使用以下 jquery，但无法让它工作:

 function getCars() {
        $.ajax({
            type: "POST",
            url: "GS1-128-Palle.aspx/populatePalleList",
            data: "{'index':1}",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (response) {
                var branches = response.d;
                $('select').empty();
                $.each(branch, function (index, branches) {
                    $('select').append('<option >' + branch + '</option>');
                });
            },

            failure: function (msg) {
            }
        });
    }

我错过了什么？

Answer 1

试试这个:-

$(add_button).click(function (e) { //on add input button click
e.preventDefault();
if (x < max_fields) { //max input box allowed
    x++; //text box increment
    var dv = $('<div/>'),
     select = $('<select/>').appendTo(dv);
    dv.append('<input type="text" name="mytext[]"/><a href="#" class="remove_field">Remove</a>');
    $(wrapper).append(dv);
    getCars(select);
 }
});

和你的 getCars 函数:-

function getCars(select) {
$.ajax({
    type: "POST",
    url: "GS1-128-Palle.aspx/populatePalleList",
    data: "{'index':1}",
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: function (response) {
        var branches = response.d;
        $(select).empty();
        $.each(branches, function (index, branch) {
            $(select).append('<option >' + branch + '</option>');
        });
    },

    failure: function (msg) {
    }
});
 }