Question

您好我有一个选择框，我使用ajax为它添加选项。我首先要删除所有现有选项并从数组中追加新选项。但是没有显示选项。

我的选择框：

<div class="btn-group">
    <select class="selectpicker" id="open_po_number" name="open_po_number" data-style="btn-primary">
    </select>
</div>

我的ajax回复：

var vendor_po_list = response.vendor_po_list;
alert(vendor_po_list);
$('#open_po_number').find('option').remove();
$.each(vendor_po_list, function(i, item){
    $('#open_po_number').append($('<option>', {
        value: vendor_po_list[i],
        text: vendor_po_list[i]
    }));
});

我能够在警告框中看到我的数组，但这些值没有附加到选择框。这该怎么做？我还想首先删除现有的选项。

编辑：
//来自控制台日志

vendor_po_list = ["PO-2", "PO-3", "PO-4", "PO-5", "PO-6", "PO-7", "PO-10", "PO-11"]

完成ajax：

$('[name="grn_vendor"]').on('change',function(){
    var vndor_name = $(this).val();
    if (vndor_name != 'none'){
        $.ajax({
            url : "/grn_qc/",
            type : "POST",
            data : {action:'get_po_no',
                    vndor_name:vndor_name},

            success : function(response){
                var vendor_po_list = response.vendor_po_list;
                console.log(vendor_po_list);
                $('#open_po_number').empty();
                $.each(vendor_po_list, function(i, item) {
                  $('#open_po_number').append($('<option>', {
                    value: vendor_po_list[i],
                    text: vendor_po_list[i]
                  }));
                });
            },

            error : function(xhr,errmsg,err) {
                console.log(xhr.status + ": " + xhr.responseText);
            }
           });
    }
});

Answer 1

相反，您可以使用.empty()方法：

＆＃13;

var vendor_po_list = ["PO-2", "PO-3", "PO-4", "PO-5", "PO-6", "PO-7", "PO-10", "PO-11"];

$('#open_po_number').empty();
$.each(vendor_po_list, function(i, item) {
  $('#open_po_number').append($('<option>', {
    value: vendor_po_list[i],
    text: vendor_po_list[i]
  }));
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="open_po_number">
  <option>one</option>
  <option>two</option>
  <option>three</option>
</select>

＆＃13;

Jquery没有附加从数组中选择字段的选项

1 个答案: