Невозможно выбрать результат из результатов поиска select2

Я использую 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;
            } 
        });
    });

Это мой объект_результата

"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"}]

json php html jquery-select2
person Manoj Sreekumar    schedule 10.04.2013    source источник

Ответы (4)


arrow_upward
38
arrow_downward

У вас отсутствует атрибут id для данных результатов. если это не так, он делает опцию «недоступной для выбора».

Пример:

            $('#e7').select2({
                    id: function(e) { return e.productName; },
            });
person Telvin Nguyen    schedule 11.04.2013
comment
Сэкономил мое время!!... У них ужасная документация!.. Их пример AJAX должен упоминать об этом... - person Dhrumil Bhankhar; 10.06.2017
comment
Telvin, ссылка не работает .. И, кстати, добавление идентификатора не имело значения для меня. - person Alexander Suraphel; 25.06.2017
comment
@AlexanderSuraphel Этот ответ был получен четыре года назад, и он должен был решить проблему OP на случай, если ссылка будет неработающей, поэтому я поместил пример кода, чтобы указать на это, поэтому ссылка не имеет значения. Плагин также обновляется, и многие вещи были изменены. Теперь я понятия не имею, в чем твоя проблема. Извини. - person Telvin Nguyen; 26.06.2017
comment
@TelvinNguyen хорошо. Для меня удаление ссылки сейчас имело бы смысл. Плюс никто не приходит в SO, чтобы решить проблему OP. Люди отвечают здесь, чтобы помочь многим людям. - person Alexander Suraphel; 26.06.2017
comment
@AlexanderSuraphel Я согласен с удалением ссылки. Это должно было показать, зачем нужен идентификатор. Я удаляю ссылку, так как она больше не доступна. Однако, пожалуйста, не принимайте это лично, потому что это не может вам помочь, внимательно прочитайте, как работает ответ SO stackoverflow.com/help /how-to-answer (Ответить на вопрос) - person Telvin Nguyen; 27.06.2017

arrow_upward
2
arrow_downward

Поскольку я использовал AJAX, мне помогло вернуть что-то в качестве идентификатора для 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,
                    }
                })
            }
        },
    },
});
person Gus    schedule 23.09.2017

arrow_upward
0
arrow_downward

Я столкнулся с той же проблемой, другое решение этой проблемы: -

В вашем объекте ответа (в приведенном выше ответе на объект сведений о продукте) должен быть «id» в качестве ключа и значения для этого.

Пример: - Ваш указанный выше объект ответа должен быть таким

{"id":"1","productName":"samsung galaxy s3","производитель":"Samsung","productOptions":"Цвет;Память","productOptiondesc":"Серебристый;32 ГБ"}

ТАК, что вам не нужен этот идентификатор: функция (объект) {return object.key;}

person anil    schedule 17.11.2015

arrow_upward
0
arrow_downward

Параметр 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' }
 }
);
person Sergio Abreu    schedule 07.06.2016