[英]Select2 and JSON Data
I am using select2 version 4 and I have a REST service control on an XPage, that reads the fullname column from the names.nsf. 我正在使用select2版本4,我在XPage上有一个REST服务控件,它从names.nsf读取fullname列。
I have the search working, but for some reason, I don't get a list of values back I can select. 我有搜索工作,但由于某种原因,我没有得到我可以选择的值列表。
The JSON object being returned, looks something like this: 返回的JSON对象如下所示:
[{"@entryid":"1376-E6D5EBE8ADBEFA7088257DF8006E4BA2","fullname":"Full Name\/OU\/O"},{"@entryid":"1375-FD1CB92A13BFD0E088257DE4006756D7","fullname":"Another Full Name\/OU\/O"}]
The code to initialize the select2 looks like this: 初始化select2的代码如下所示:
x$( "#{id:comboBox1}" ).select2({
ajax: {
url: "xJSON.xsp/names",
dataType: 'json',
delay: 250,
data: function (params) {
return {
search:'[fullname=]*'+params.term+'*',
// q: params.term, // search term
page: params.page
};
},
results: function (data, page){
},
processResults: function (data, page) {
// parse the results into the format expected by Select2.
// since we are using custom formatting functions we do not need to
// alter the remote JSON data
console.log(data);
return {
results: data
};
},
cache: true
},
//escapeMarkup: function (markup) { return markup; },
minimumInputLength: 1
});
When I look at the browser's console, I can see that the search worked and JSON objects are being returned, however, I don't get a list of values to select from. 当我查看浏览器的控制台时,我可以看到搜索工作正在返回JSON对象,但是,我没有得到可供选择的值列表。
For the result return I've tried results: data.fullname and results: data, text:'fullname' but nothing happens. 对于结果返回我已经尝试过结果:data.fullname和results:data,text:'fullname'但没有任何反应。
What am I doing worng? 我在做什么?
You need to either switch your JSON response to include id
and text
for each object, or re-map them in your processResults
method. 您需要切换JSON响应以包含每个对象的id
和text
,或者在processResults
方法中重新映射它们。 These two properties are required on all selectable objects now in Select2 4.0. 现在Select2 4.0中的所有可选对象都需要这两个属性 。 Since I'm assuming you either can't change your JSON response, or it wouldn't make sense to, you can easily re-map the data with the following processResults
method. 由于我假设您无法更改JSON响应,或者它没有意义,您可以使用以下processResults
方法轻松地重新映射数据。
processResults: function (data) {
var data = $.map(data, function (obj) {
obj.id = obj.id || obj["@entityid"];
obj.text = obj.text || obj.fullname;
return obj;
});
return {
results: data
};
});
This will map the @entityid
property to the id
property and the fullname
property to the text
property. 这会将@entityid
属性映射到id
属性,将fullname
属性映射到text
属性。 So selections will be sent to your server containing the @entityid
and will be displayed using the fullname
. 因此,选择将发送到包含@entityid
的服务器,并将使用fullname
显示。
Also, the results
method is no longer needed in Select2 4.0. 此外,Select2 4.0中不再需要results
方法。 This was renamed to the current processResults
method. 这被重命名为当前的processResults
方法。
I copied your code exactly as it is, and just changed the fieldname
and the search query and worked out just fine. 我完全按照原样复制了您的代码,只是更改了fieldname
和搜索查询,并且运行得很好。
This is my JSON
looks like 这是我的JSON
看起来像
[{"@entryid":"1482-AD112B834158AD0D80257E4B004EC42E","@unid":"AD112B834158AD0D80257E4B004EC42E","id":"Victor Hunter","text":"Odhran Patton"},{"@entryid":"1496-291F2480D806A91E80257E4B004EC3D2","@unid":"291F2480D806A91E80257E4B004EC3D2","id":"Wesley O'Meara","text":"Wesley O'Meara"},{"@entryid":"1421-CC19D06880F5DC2980257E4B004EC537","@unid":"CC19D06880F5DC2980257E4B004EC537","id":"Stephen Woods","text":"Emma Doherty"}]
What I know is that select2
expects an id
, and a text
parameters from the JSON
. 我所知道的是select2
需要一个id
和来自JSON
的text
参数。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.