如何重新加载下拉列表

本文关键字:下拉列表 加载 何重新 | 更新日期: 2023-09-27 18:14:36

我想重新加载下拉列表。

如果我现在在下拉列表上做一个选择,我选择了其他选项,那么之前的值也会显示出来。

 <script type="text/javascript">
    $(document).ready(function () {
        $("#SelectedCategoriedFaqId").change(function () {
            $.ajax({
                url: "/Medicijnverstrekking/FAQ/SubCategorie/",
                type: 'POST',
                dataType: 'json',
                data: {
                    Categorieid: this.value
                },
                success: function (data) {
                    $('SelectedCategoriedFaqId').val('').trigger('liszt:updated');
                    //alert("Data retrieval successfull");
                    var items = "";
                    $.each(data, function (i, val) {
                        var opt = $("<option></option>")
                          .attr("value", val.Value)
                          .text(val.Text);
                        $('#FaqCategorie_Id').append(opt);
                    });
                },
                error: function (xhr) {
                    alert("Something seems Wrong");
                }
            });
        });  
    });      
</script>

谢谢

如何重新加载下拉列表

$.each(data, function (i, val) {
                    var opt = $("<option></option>")
                      .attr("value", val.Value)
                      .text(val.Text);
                    $('#FaqCategorie_Id').append(opt);
                });

只写:

$('#FaqCategorie_Id').empty();

这将从您的下拉菜单中删除所有项目,然后您从ajax请求中获得的新项目将添加到您的下拉菜单中。

您应该首先从列表中删除所有其他选项,然后再添加ajax检索的选项。假设第一个选项是

<option value=""></option>

,你可以:

success: function (data) {
    var ddl = $('SelectedCategoriedFaqId');
    ddl[0].options.length = 1;
    ddl.val('').trigger('liszt:updated');
    //alert("Data retrieval successfull");
    var items = "";
    $.each(data, function (i, val) {
        var opt = $("<option></option>")
            .attr("value", val.Value)
            .text(val.Text);
        ddl.append(opt);
});

HTH