AJAX 结果问题 - Data.Results 未定义

Question

我正在尝试设置 Select2 以使用 Ajax，但我陷入了困境。我已经在 IE 中进行了调试，并确认我的 AJAX 正在返回结果，因此这似乎不是问题。输入框加载，但当我输入“mi”作为“milk”时，它只是说“正在搜索...”，但从未找到任何东西!

这是我的 Jquery:

        $(document).ready(function () {
            $('#e1').select2({
                placeholder: "Select an ingredient...",
                minimumInputLength: 2,
                ajax: {
                    url: "../api/IngredientChoices",
                    dataType: "jsonp",
                    quietMillis: 500,
                    data: function (term, page) {
                        return {
                            q: term,
                            page_limit: 10,
                            page: page

                        };
                    },
                    results: function (data, page) {
                        var more = (page * 10) < data.total;
                        return {
                            results: data.MainName, more:more
                        }

                    }
                }
            });
        });

JSON:

[{"SubItemID":1,"MainItemID":1,"SubName":"2%","MainName":"Milk"},{"SubItemID":2,"MainItemID":1,"SubName":"Skim/Fat Free","MainName":"Milk"},{"SubItemID":3,"MainItemID":2,"SubName":"Chedder","MainName":"Cheese"}]

HTML:

<td><input type="hidden" id="e1" /></td>

如果我将 dataType 更改为 json，当我在框中输入“mi”时，我会收到不同类型的错误。

这是工作版本的最终代码:

            $('#e1').select2({
                placeholder: "Select an ingredient...",
                minimumInputLength: 2,
                ajax: {
                    url: "../api/IngredientChoices",
                    dataType: "json",
                    quietMillis: 500,
                    data: function (term, page) {
                        return {
                            q: term,
                            page_limit: 10,
                            page: page

                        };
                    },
                    results: function (data, page) {
                        var more = (page * 10) < data.length;
                        console.log(more);
                        console.log(data);
                        return { results: data, more: more };

                    },
                    formatResult: function (post) {
                        markup = '<strong>' + post.text + '</strong>';
                    }
                }
            });

Answer 1

您遇到的错误似乎是由于您获得的结果的格式造成的。 Select2 的预期结果是具有 id: 和 text: 属性的对象的集合。

[{ id: 1, text: '字符串' }, { id: 2, text: '其他字符串'}]