JQuery UI Multiselect, как получить значения выбранных опций - PullRequest
5 голосов
/ 06 января 2012

потратил впустую мой день при поиске, как получить значения выбранных опций в виджете пользовательского интерфейса JQuery от Майкла Ауфрайтера. Вот ссылка на его демонстрационный сайт и github: http://quasipartikel.at/multiselect/

В результате мне просто нужны поля значений выбранных опций без отправки POST / GET в скрипт PHP. Я перепробовал много методов и безрезультатно. Нужна ваша помощь и идеи

* Нашел много тем о jquery ui multiselect, но бесполезно из-за Aufreiter: s *

Ответы [ 5 ]

15 голосов
/ 23 января 2012

Это должно работать. Протестировано с консолью Chrome

$("#countries").val();
3 голосов
/ 06 января 2012

Я зашел на сайт, который вы перечислили выше, и смог запустить его в моей консоли chrome:

$('.ui-multiselect .selected li').each(function(idx,el){ console.log(el.title); });

Похоже, что нужные значения хранятся в атрибутах title элементов списка в элементе div.selected.

Edit:

Doh! Ну, конечно, вы хотите, чтобы ценности. Извини друг. Полностью пропустил это. Реальные товары хранятся в объектах jQuery () . В этом случае вам нужен ключ «optionLink». Он поддерживает ссылку на элемент option. Каждый элемент списка в div «.selected» использовал метод jQuery.data (), чтобы добавить к нему базовый параметр.

Итак, вам нужно получить выбранные элементы списка, выполнить итерацию, получить 'optionLink' из хранилища данных jQuery, а затем получить значение.

Следующий код работает на странице примера:

$('.ui-multiselect .selected li').each(function(idx,el){
    console.log(el);
    var link = $(el).data('optionLink');
    // link now points to a jQuery wrapped <option> tag


    // I do a test on link first.  not sure why, but one of them was undefined.
    // however, I got all four values.  So I'm not sure what the first <li>
    // is.  I'm thinking it's the header...
    if(link){

        // here's your value. add it to an array, or whatever you need to do.
        console.log(link.val());
    }

});

Это первый раз, когда я увидел мультиселект. Это гладко Но я сочувствую твоему разочарованию, пытаясь что-то выяснить. Было бы неплохо получить метод getSelectedOptions ().

Приветствия

1 голос
/ 01 апреля 2015

Лучшее решение

$('#select').multiselect({
    selectAllValue: 'multiselect-all',
    enableCaseInsensitiveFiltering: true,
    enableFiltering: true,
    height: "auto",
    close: function() {
            debugger;
            var values = new Array();
            $(this).multiselect("getChecked").each(function(index, item) {

                values.push($(item).val());
            });
            $("input[id*=SelectedValues]").val(values.join(","));
    }
}); 
1 голос
/ 04 мая 2013

Попробуйте получить доступ к выбранным значениям события закрытия.

например.

$("#dropdown").multiselect({
    header: false,
    selectedList : 1,
    height: "auto",
}).multiselectfilter().bind("multiselectclose", function(event, ui) {
    var value = $("#dropdown").val();
});

Надеюсь, это поможет.

0 голосов
/ 18 июля 2016

Вы можете попробовать это:

$('#ListBoxId').multiselect({
    isOpen: true,
    keepOpen: true,
    filter: true
});
...