Select2 是否允许将“文本”键的名称更改为其他名称？答案

【问题标题】：Does Select2 allow for changing name of "text" key to something else?Select2 是否允许将“文本”键的名称更改为其他名称？
【发布时间】：2013-10-21 21:20:37
【问题描述】：

我有以下 Select2 配置。

$scope.select2Options = {
    simple_tags: false,
    placeholder : "Search for a language",
    multiple : true,
    contentType: "application/json; charset=utf-8",
    minimumInputLength : 3,
    ajax : {
        url : "/bignibou/utils/findLanguagesByLanguageStartingWith.json",
        dataType : 'json',
        data : function(term) {
            return  {
                language : term
            };
        },
        results : function(data, page) {
            return {
                results :
                    data.map(function(item) {
                        return {
                            id : item.id,
                            text : item.description
                        };
                    }
            )};
        }
    }
};

这让我可以正确地填充 select2 控件。

但是，当我使用 Ajax 发布包含标签（以及其他）的整个表单时会出现问题：发送到服务器的 json 数组包含具有两个名为 id 的属性的对象和 text 而服务器需要 id 和 description。

从我的 json 中查看 sn-p：

"languages":[{"id":46,"text":"Français"},{"id":1,"text":"Anglais"}]

select2 是否允许将 text 的名称更改为其他名称？

【问题讨论】：

标签： json jquery-select2 angularjs-select2

【解决方案1】：

将我的 js 更改为以下排序问题：

function format(item) { return item.description; };

$scope.select2Options = {   
    simple_tags: false,
    placeholder : "Search for a language",
    multiple : true,
    contentType: "application/json; charset=utf-8",
    minimumInputLength : 3,
    data:{ text: "description" },
    formatSelection: format,
    formatResult: format,
    ajax : {
        url : "/bignibou/utils/findLanguagesByLanguageStartingWith.json",
        dataType : 'json',
        data : function(term) {
            return  {
                language : term
            };
        },
        results : function(data, page) {
            return {
                results :
                    data.map(function(item) {
                        return {
                            id : item.id,
                            description : item.description
                        };
                    }
            )};
        }
    }
};

注意：必须使用 Select2 顶级属性data。

【讨论】：

【解决方案2】：

这是在 ui-select2 上使用自定义 id 和文本属性所必需的最低配置

$scope.clients: {
  data: [{ ClientId: 1, ClientName: "ClientA" }, { ClientId: 2, ClientName: "ClientB" }],
  id: 'ClientId',
  formatSelection: function (item) { return item.ClientName; },
  formatResult: function (item) { return item.ClientName; }
}

【讨论】：

【解决方案3】：

Select2 要求应为选项显示的文本存储在 text 属性中。您可以使用以下 JavaScript 从任何现有属性映射此属性：

var data = $.map(yourArrayData, function (obj) {
  obj.text = obj.text || obj.name; // replace name with the property used for the text
  obj.id = obj.id || obj.pk; // replace pk with your identifier
  return obj;
});

Documentation

【讨论】：