Select2 — Ajax Data — заполнить выпадающий список на основе запроса

Question

Select2 — Ajax Data — заполнить выпадающий список на основе запроса

Я использую Select2, чтобы заполнить выпадающий список городов Великобритании. Поскольку база данных UK Towns огромна, я подумал, что вызов AJAX будет лучшим способом ввода данных.

Я построил функцию post и немного PHP (в Codeigniter), чтобы перехватить запрос и разобрать его.

Я вижу, что данные публикуются и отвечают, но мой Select2 не заполняется данными.

Мой JQuery для этого:

 $("#areas").select2(
{
tags: [],
ajax: {
url: '/profile/get-towns',
dataType: 'json',
type: "POST",
quietMillis: 100,
data: function (term) {
return {
query: term
};
},
results: function (data) {
return {
results: data.town_id
}
},
cache: true
},
escapeMarkup: function (markup) { return markup; }, // let our custom formatter work
minimumInputLength: 4,
placeholder         : "Start typing your Town / City",
maximumSelectionSize: 2
}
);

Мой ответ jSON (пример) выглядит следующим образом:

[{"town_id":"16994","town":"Hartle"},{"town_id":"16995","town":"Hartlebury"},{"town_id":"16996","town":"Hartlebury"},{"town_id":"16997","town":"Hartlebury Common"},{"town_id":"16998","town":"Hartlepool"},{"town_id":"16999","town":"Hartley"},{"town_id":"17000","town":"Hartley"},{"town_id":"17001","town":"Hartley"},{"town_id":"17002","town":"Hartley"},{"town_id":"17003","town":"Hartley Green"},{"town_id":"17004","town":"Hartley Green"},{"town_id":"17005","town":"Hartley Mauditt"},{"town_id":"17006","town":"Hartley Wespall"},{"town_id":"17007","town":"Hartley Wintney"},{"town_id":"27051","town":"New Hartley"},{"town_id":"35891","town":"Stowe-by-Chartley"}]

Куда я иду не так? В идеале я бы хотел, чтобы в раскрывающемся списке выбора было выбрано значение value = town_id, а параметром select — название города.

Благодарю вас.

0

codeigniter jquery jquery-select2 php

Решение

Другие решения

На вашем Ajax-вызове попробуйте добавить успех. Что-то вроде этого:

success: function( json ) {
$.each(items, function (i, item) {
$('#mySelect').append($('<option>', {
value: item.value,
text : item.text
}));
)};
}

-1

Источник

Accepted Answer

в вашем select2 конфигурация:

results: function (data) {
var res = [];
for(var i  = 0 ; i < data.length; i++) {
res.push({id:data[i].town_id, text:data[i].town});
}
return {
results: res
}
},

еще потому select2 хочет результаты как массив объектов с ключами id а также text,

Иначе вы уже можете вернуть правильно сформированный объект

[
{"id":"16994","text":"Hartle"},
{"id":"16995","text":"Hartlebury"},
{"id":"16996","text":"Hartlebury"},
{"id":"16997","text":"Hartlebury Common"}
]

затем

results: function (data) {
return {
results: data
}
},

5