Question

我刚开始使用[select2] [1]而且我正在开发一个项目，需要一个从JSON数据源填充的标签列表（比如在StackOverflow上）。我正在使用在这个问题上找到的一个例子：[在Select2中使用Ajax标记] [2]但是我在使用它时遇到了一些麻烦。

        // Testing JSON load
        $("#testJsonLoad").select2({
            tags: true,
            tokenSeparators: [",", " "],
            createSearchChoice: function (term, data) {

                if ($(data).filter(function () {
                    return this.text.localeCompare(term) === 0;
                }).length === 0) {
                    return {
                        id: term,
                        text: term
                    };
                }
            },
            multiple: true,
            ajax: {
                url: 'data.json',
                dataType: "json",
                data: function (term, page) {
                    return {
                        q: term
                    };
                },
                results: function (data, page) {
                    return {
                        results: data
                    };
                }
            }
        });

仅出于测试目的，data.json页面中包含以下数据：

{
"data": [
    { "id" : 1, "text" : "Alabama" },
    { "id" : 2, "text" : "Alaska" },
    { "id" : 3, "text" : "Arizona" },
    { "id" : 4, "text" : "Arkansas" },
    { "id" : 5, "text" : "California" },
    { "id" : 6, "text" : "Colorado" },
    { "id" : 7, "text" : "Connecticut" },
    { "id" : 8, "text" : "Delaware" },
    { "id" : 9, "text" : "District of Columbia" },
    { "id" : 10, "text" : "Florida" },
    { "id" : 11, "text" : "Georgia" },
    { "id" : 12, "text" : "Hawaii" },
    { "id" : 13, "text" : "Idaho" } ]
}

我的问题是我收到此错误： this.text未定义 - 第78行

return this.text.localeCompare(term) === 0;

我认为这可能与我的JSON格式化方式有关。我尝试过几种不同的格式，我的大部分在线研究都没有取得积极的成果。

Answer 1

结果需要json中的 id 和 text 节点，您可以告诉您的JSON使用这些节点名称输出结果或指定在JS中使用哪些节点名称：

网站示例：

query: function (query) {
  var data = {results: []}, i, j, s;
  for (i = 1; i < 5; i++) {
    s = "";
    for (j = 0; j < i; j++) {s = s + query.term;}
    data.results.push({id: query.term + i, text: s});
  }
  query.callback(data);
}

Answer 2

在if（$（data）.filter（function（）之前放置调试器并检查你在$（数据）中得到了什么

Answer 3

我发现了这个问题。我需要在结果ajax函数中调用data.data（在我的例子中）。

示例：

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

select2使用JSON进行标记

3 个答案: