添加选项以动态选择2

Question

我已经阅读了有关如何动态地向select2添加选项的所有可能的参考，但没有一个工作。我猜这些已被复制。

我希望当用户在组合的搜索框中输入时，我想在服务器中搜索我的列表并在列表中显示匹配的列表。

    <select class="js-data-example-ajax" id="mySelect2">
    </select>
    <script>
        $(document).ready(function() {
            $('.js-data-example-ajax').select2({
                language: "fa",
                dir: "rtl",
                ajax: {
                    url: 'search_employees',
                    processResults: function (data) {
                        for (i = 0; i < data.items.length; i++){
                            var newOption = new Option(data.items[i].name, data.items[i].id, false, false);
                            $('#mySelect2').append(newOption).trigger('change');
                        }
                    },
                    data: function (params) {
                        var query = {
                            search: params.term,
                            type: 'public'
                        };
                        // Query parameters will be ?search=[term]&type=public
                        return query;
                    }
                }
            });
        });
    </script>

我确定'search_employees'的回复，采用以下格式：

{"items": [{"id": 8, "name": "Hamed"}]}

和'data.items [i] .name'和'data.items [i] .id'是正确的。

我检查了代码中的代码，这个代码有一些<option>标签，我的意思是这个工作并在这个<select>中添加Hamed作为<option>标签，但它们根本没有显示。

有什么我想念的吗？

TNX

Answer 1

为什么不简单地在processResults处理程序中进行以下转换？

 processResults: function (data) {
    if (data.items && data.items.length==0) {
        $('.js-data-example-ajax').val(null).trigger('change');
    }
    return {
        results: $.map(data.items, function(obj) {
          return { id: obj.id, text: obj.name };
    })
 };

这是一个工作小提琴：http://jsfiddle.net/beaver71/htqyybmc/

P.S。：在jsfiddle中模拟了ajax请求，因此查询未应用且结果未被过滤