填写选择的下拉列表

Question

我正在使用 Razor 页面

我有 2 个下拉列表

当 select 使用 jquery 第一个的索引更改时，第二个正在填充

 <script>
        $(document).ready(function () {
            $("#nomclient").on("change", function () {
                $list = $("#idconnexion");
                $.ajax({
                    url: "/api/ddl",
                    type: "GET",
                    data: { id: $("#nomclient").val() }, //id of the state which is used to extract cities
                    traditional: true,
                    success: function (result) {
                        $list.empty();
                        $.each(result, function (i, item) {
                            $list.append('<option value="' + item["idConnexion1"] + '"> ' + item["idConnexion1"] + ' </option>');
                        });
                    },

                });
            });
        });
    </script>

它运行良好。

问题是当我添加这个

$("#idconnexion").chosen({ width: '90%' });

第二个下拉列表没有填充，但是当我删除它时，它又填充了。

任何建议

Answer 1

您必须告诉 chosen select 选项已更改：

$('.my_select_box').trigger('chosen:updated');

Reference

所以在你的情况下：

// ...
success: function (result) {
   $list.empty();
   $.each(result, function (i, item) {
      $list.append('<option value="' + item["idConnexion1"] + '"> ' + item["idConnexion1"] + ' </option>');
   });
   $list.trigger('chosen:updated');
},
// ...

填写选择的下拉列表

Fill Chosen dropdownlist

jquery

jquery-chosen

dropdown