Question

我正在尝试实施远程数据选择2。

Json数据很好，但是select2不会显示结果，而是只显示微调图像并显示加载。

这是 Json

[{"FormID":"1","FormName":"Dashboard"}]

我只希望FormName显示在结果中，但它不起作用：（

脚本

    $('#selectParentMenu').select2({
       minimumInputLength:2,
       placeholder:"Select Parent Menu",
        ajax: {
            type:"post",
            url: "{{base_url()}}admin/configurations/loadAllParentFormNames/",
            dataType: 'json',
            quietMillis: 100,
            data: function(term, page) {
                return {
                    types: ["exercise"],
                    limit: -1,
                    term: term
                };
            },
            results: function(data, page ) {
                return { results: data.FormName }
            }
        },
        formatResult: function(exercise) {
            return "<div class='select2-user-result'>" + exercise.term + "</div>";
        },
        formatSelection: function(exercise) {
            return exercise.term;
        },
        initSelection : function (element, callback) {
            var elementText = $(element).attr('data-init-text');
            callback({"term":elementText});
        }
    });

HTML

 <div class="col-lg-8" id="haveParentDiv">
    <input class="make-switch" id="haveParent" type="checkbox" data-on-color="success" data-on-text="Yes" data-off-text="NO" data-off-color="danger">
     </div>

enter image description here

我认为问题在于

        results: function(data, page ) {
            return { results: data.FormName }
        }

但我不确定用数据写什么。??

当我只尝试数据时，不是搜索它说未定义，但至少我知道它可以给出结果，这里有些错误。

我关注这个例子： http://jsfiddle.net/LUsMb/16/

Answer 1

我不得不对我的代码做一点改动，但它现在正在工作。

脚本：

$('#selectParentMenu').select2({
               minimumInputLength:1,
               placeholder:"Select Parent Menu",
                ajax: {
                    type:"post",
                    url: "{{base_url()}}admin/configurations/loadAllParentFormNames/",
                    dataType: 'json',
                    quietMillis: 100,
                    data: function(term, page) {
                        return {
                            term: term, //search term
                            page_limit: 10 // page size
                        };
                    },
                    results: function(data, page ) {
                        var newData = [];
                        _.each(data, function (item) {
                            newData.push({
                                id: item.FormID  //id part present in data
                                , text: item.FormName  //string to be displayed
                            });
                        });
                        return { results: newData };
                    }

                }
            });

我删除了一些我不了解的旧行。并添加了这个..

results: function(data, page ) {
    var newData = [];
    _.each(data, function (item) {
        newData.push({
            id: item.FormID  //id part present in data
            , text: item.FormName  //string to be displayed
        });
    });
    return { results: newData };
}

我从

获得此代码

select2: "text is undefined" when getting json using ajax

好吧有一些问题，我不得不使用underscore.js库，如果有人可以改变一些代码正常的循环我会喜欢接受他/他的答案。我不希望我的代码有额外的库。

如果有人可以，请将此更改为正常循环。

_.each(data, function (item) {
                            newData.push({
                                id: item.FormID  //id part present in data
                                , text: item.FormName  //string to be displayed
                            });

更新

for ( var i = 0; i < data.length; i++ ) {
                            newData.push({
                                id: data[i].FormID,  //id part present in data
                                text: data[i].FormName  //string to be displayed
                            });

感谢stackoverflow社区，帮助我解决了循环问题。

Answer 2

将result: function(data, page)替换为processResults: function(data, page)

Select2不显示Json的结果

2 个答案: