jQuery ...填充多个下拉列表

Question

我有一个像这样的ajax调用，对于每个结果，我都会显示一个下拉菜单：

$.each(results, function (key, value) {
     html += "<select id='vendorDropdown'><option value='0'>-- Select Vendor --</option></select>"
}

我正在使用另一个ajax调用填充下拉列表：

$.ajax({
                    type: "GET",
                    url: "/vendorProject/api/connection/getVendors",
                    dataType: 'json',
                    cache: false,
                    success: function (results) {
                        var vendorDropdown = $("#vendorDropdown");
                        $.each(results, function (row, value) {
                            vendorDropdown.append($("<option />").val(value.Vendor_ID).text(value.Vendor_Name));
                        });
                    }
                });

我的问题是，这只会填充第一个下拉列表而不是其他任何内容，这是因为它们都具有相同的ID ...我现在要做的是使ID唯一值：

$.each(results, function (key, value) {
         html += "<select id='vendorDropdown-" + value +"'><option value='0'>-- Select Vendor --</option></select>"
    }

我的问题是，如何使用其他ajax调用中的唯一ID来定位这些下拉列表？

Answer 1

试试这个，

var cnt = 0;
$.each(results, function (key, value) {
  html += "<select id='vendorDropdown-" + value + i +"'><option value='0'>-- Select Vendor --</option></select>"
  i++;
}