如何获取Select2下拉列表中的所有值?

时间:2022-03-06 23:07:25

How can we get all the elements that are in the jQuery Select2 dropdown plugin.

我们如何获得jQuery Select2下拉插件中的所有元素。

I have applied Select2 to a input type = hidden, and then populated it using Ajax.

我已将Select2应用于输入类型=隐藏,然后使用Ajax填充它。

Now at one instance I need to get all the values that are appearing in the dropdown.

现在在一个实例中,我需要获取下拉列表中出现的所有值。

Here is a input field.

这是一个输入字段。

<input type="hidden" id="individualsfront" name="individualsfront" style="width:240px" value="" data-spy="scroll" required />

and to this input field I have applied this

我已经应用了这个输入字段

$("#individualsfront").select2({
    multiple: true,
    query: function (query){
        var data = {results: []};
        $.each(yuyu, function(){
            if(query.term.length == 0 || this.text.toUpperCase().indexOf(query.term.toUpperCase()) >= 0 ){
                data.results.push({id: this.id, text: this.text });
            }
        });
        query.callback(data);
    }
});

The yuyu is a json coming from some AJAX call and populating the Select2.

yuyu是来自某些AJAX调用的json,并填充了Select2。

Now I want in some other code a way to get all the values inside the Select2.

现在我想在其他一些代码中获取Select2中的所有值。

3 个解决方案

#1


2  

option 1: you can use directly the data object

选项1:您可以直接使用数据对象

var results = [];
$("#individualsfront").select2({
    multiple: true,
    query: function (query){
        var data = {results: []};
        $.each(yuyu, function(){
            if(query.term.length == 0 || this.text.toUpperCase().indexOf(query.term.toUpperCase()) >= 0 ){
                data.results.push({id: this.id, text: this.text });
            }
        });

        results = data.results; //<=====  
        query.callback(data);
    }
});

and use it like this for example:

并像这样使用它,例如:

$('#individualsfront').on('open',function(){
    $.each(results, function(key,value){
        console.log("text:"+value.text);
    });
});

option 2: request the feature and use (temporary) something like:

选项2:请求功能并使用(临时)类似的东西:

$('#individualsfront').on('open',function(){
    $(".select2-result-label").each(function()
        {
            console.log($(this).text());
        })
    });
});

http://jsfiddle.net/ouadie/qfchH/1/

option 3: you can use .select2("data"); but it returns all elements only if there is no selected element.

http://jsfiddle.net/ouadie/qfchH/1/选项3:你可以使用.select2(“data”);但只有在没有选定元素时才会返回所有元素。

var arrObj = $("#individualsfront").select2("data");
for each(yuyu in arrObj)
{
   console.log("id: "+yuyu.id+ ", value: "+yuyu.text);
}

#2


0  

I was trying to figure this out myself and found that you can get at least the options in a select2.

我试图自己解决这个问题,发现你至少可以在select2中获得选项。

var options = $("#dropdown").find("option")
var optionsText = $("#dropdown").find("option[value='1']").text()

#3


0  

function select2Options($elementSelect2) {
    var data = [],
        adapter = $elementSelect2.data().select2.dataAdapter;
    $elementSelect2.children().each(function () {
        if (!$(this).is('option') && !$(this).is('optgroup')) {
            return true;
        }
        data.push(adapter.item($(this)));
    });
    return data;
}

#1


2  

option 1: you can use directly the data object

选项1:您可以直接使用数据对象

var results = [];
$("#individualsfront").select2({
    multiple: true,
    query: function (query){
        var data = {results: []};
        $.each(yuyu, function(){
            if(query.term.length == 0 || this.text.toUpperCase().indexOf(query.term.toUpperCase()) >= 0 ){
                data.results.push({id: this.id, text: this.text });
            }
        });

        results = data.results; //<=====  
        query.callback(data);
    }
});

and use it like this for example:

并像这样使用它,例如:

$('#individualsfront').on('open',function(){
    $.each(results, function(key,value){
        console.log("text:"+value.text);
    });
});

option 2: request the feature and use (temporary) something like:

选项2:请求功能并使用(临时)类似的东西:

$('#individualsfront').on('open',function(){
    $(".select2-result-label").each(function()
        {
            console.log($(this).text());
        })
    });
});

http://jsfiddle.net/ouadie/qfchH/1/

option 3: you can use .select2("data"); but it returns all elements only if there is no selected element.

http://jsfiddle.net/ouadie/qfchH/1/选项3:你可以使用.select2(“data”);但只有在没有选定元素时才会返回所有元素。

var arrObj = $("#individualsfront").select2("data");
for each(yuyu in arrObj)
{
   console.log("id: "+yuyu.id+ ", value: "+yuyu.text);
}

#2


0  

I was trying to figure this out myself and found that you can get at least the options in a select2.

我试图自己解决这个问题,发现你至少可以在select2中获得选项。

var options = $("#dropdown").find("option")
var optionsText = $("#dropdown").find("option[value='1']").text()

#3


0  

function select2Options($elementSelect2) {
    var data = [],
        adapter = $elementSelect2.data().select2.dataAdapter;
    $elementSelect2.children().each(function () {
        if (!$(this).is('option') && !$(this).is('optgroup')) {
            return true;
        }
        data.push(adapter.item($(this)));
    });
    return data;
}