用JSON和jQuery填充下拉列表

Populate dropdown with JSON and jQuery

本文关键字：填充 下拉列表 jQuery JSON      更新时间：2023-09-26

我正在尝试从另一个下拉菜单填充下拉菜单。

这发生在第一个下拉菜单的onChange事件，但我有问题，当我从下拉菜单1中选择一个选项，然后它做getJson，它返回正确的JSON值，但问题是，下拉菜单填充每次即使我选择相同的值。

代码如下:

$.getJSON("ajax.php", 
    { m: "modules/json/json-get-category",
      r: $('#id_project').has('option').val()
    }, 
    function(data){
        var html = '';
        var len = data.length;
        alert(len);
        //$('#id_category').val('').trigger('chosen:updated');
        for (var i = 0; i< len; i++) {
            html += '<option value="' + data[i].id + '">' + data[i].catName + '</option>';
        }
        $('#id_category').append(html);
});

返回JSON: 

[
    {"id":"27","catName":"Hardware support"},
    {"id":"29","catName":"test"}
]

dropdown1在第一次onChange事件上有正确的值，但是在它开始重复值之后:

例子:我有2个硬件支持，2个测试…然后它就开始添加了

您需要在添加新选项之前删除所有选项。在for循环之前，添加以下内容:

$("#id_category").find("option").remove();

这应该删除当前的项目，并为新的项目腾出空间。

在函数开始时，删除现有的选项

$('#id_category').empty();
相关文章：