Я использую select2 для своих полей поиска. Я получаю результаты от своего URL-адреса, но я не могу выбрать из него вариант. Я хочу использовать «product.productName» в качестве текста, который будет показан после выбора. Есть ли что-то, что я пропустил или какую-то ошибку, которую я совершил. Я включил select2.css и select2.min.js, jquery.js
function dataFormatResult(product) { var markup = "<table class='product-result'><tr>"; markup += "<td class='product-info'><div class='product-title'>" + product.productName + "</div>"; if (product.manufacturer !== undefined) { markup += "<div class='product-synopsis'>" + product.manufacturer + "</div>"; } else if (product.productOptions !== undefined) { markup += "<div class='product-synopsis'>" + product.productOptions + "</div>"; } markup += "</td></tr></table>"; return markup; } function dataFormatSelection(product) { return product.productName; } $(document).ready(function() { $("#e7").select2({ placeholder: "Search for a product", minimumInputLength: 2, ajax: { url: myURL, dataType: 'json', data: function(term,page) { return { productname: term }; }, results: function(data,page) { return {results: data.result_object}; } }, formatResult: dataFormatResult, formatSelection: dataFormatSelection, dropdownCssClass: "bigdrop", escapeMarkup: function(m) { return m; } }); });
Это мой объект resut_object
"result_object":[{"productName":"samsung galaxy s3","manufacturer":"Samsung","productOptions":"Color;Memory","productOptiondesc":"Silver;32GB"},{"productName":"samsung salaxy s3","manufacturer":"Samsung","productOptions":"Color;Memory","productOptiondesc":"Graphite;32GB"},{"productName":"samsung galaxy s3","manufacturer":"Samsung","productOptions":"Color;Memory","productOptiondesc":"Silver;16GB"}]
Для данных результата отсутствует атрибут id. если он этого не сделал, он делает вариант «невыбираемым».
Пример:
$('#e7').select2({ id: function(e) { return e.productName; }, });
Я столкнулся с одной и той же проблемой, другое решение для этой проблемы:
В вашем объекте ответа (в приведенном выше ответе Product details object) должен быть «id» как ключ и значение для этого.
Пример: – Ваш указанный выше объект ответа должен быть таким
{«id»: «1», «productName»: «samsung galaxy s3», «производитель»: «Samsung», «productOptions»: «Цвет, память», «productOptiondesc»: «Silver, 32GB»}
Так что вам не нужен этот id: function (object) {return object.key;}
Параметр id может быть строкой, связанной с именем свойства объекта, и должен находиться в корне объекта. Текст внутри объекта данных.
var fruits = [{code: 222, fruit: 'grape', color:'purple', price: 2.2}, {code: 234,fruit: 'banana', color:'yellow', price: 1.9} ]; $(yourfield).select2( { id: 'code', data: { results: fruits, text: 'fruit' } } );
Поскольку я использовал AJAX, то, что сработало для меня, возвращало что-то как ID на processResults:
$(field).select2({ ajax: { // [..] ajax params here processResults: function(data) { return { results: $.map(data, function(item) { return { // proccessResults NEEDS the attribute id here id: item.code, // [...] other attributes here foo: item.bar, } }) } }, }, });