Получить пользовательский атрибут данных в select2 с помощью <select>

Ответ 1

Нет прямого метода с select2, вы можете использовать комбинацию данных select2 и jQuery:

$("#example").select2().find(":selected").data("id");

Сначала вы получаете данные select2, затем найдете свой выбранный параметр с jQuery и, наконец, атрибут data.

Ответ 2

Select2 v4 использует теги <select> вместо скрытых тегов <input>, поэтому теперь легче получить выбранный параметр или параметры: вы просто ссылаетесь на оригинал <select>. Это может быть и в случае с Select2 v3, но я использовал только Select2 v4.

$('#example option:selected').attr('data-id')

демонстрация jsfiddle

См. также Получить выбранное значение в раскрывающемся списке с помощью JavaScript?

Изменить: Мне нравится этот ответ для доступа к объектам общего назначения:

var d = $("#dropdown").select2("data");

d будет массивом, содержащим выбранный элемент в качестве объектов, поэтому для доступа к свойству id первого элемента:

var id = d[0].id;

Ответ 3

$(document).ready(function() {
    $('select#myselect').select2({
        templateResult: formatOutput
    });

});
function formatOutput (item) {
    var $state = $(item.element).data('id') + ' ' + item.text;
    return $state;
};

Ответ 4

После нескольких часов попыток решить эту проблему мне удалось вытащить атрибут. Я использую 3.5.4

$("#select2").select2('data').element[0].attributes[1].nodeValue

HTML

<select id="select2" name="course" class="form-control">
  <option></option>  
  <optgroup label="Alabama">  
    <option value="City 1" data-url="/alabama/city-1">City 1</option>  
    <option value="City 2" data-url="/alabama/city-2">City 2</option>  
  </optgroup>  
</select>

Ответ 5

Мой вклад в то, как получить значение привязки данных к выбранному параметру с помощью Select2 event (3.5) (спасибо to @loreto g answer):

<select id="myselect">
    <option value="foo" data-type="bar" data-options='baz'></option>
</select>

<script>
var myselect = $('#myselect').select2();

myselect.on('select2-selecting', function(sel){

    var seltype = sel.choice.element[0].attributes['data-type'].value,
        seloptions = sel.choice.element[0].attributes['data-options'].value;

});
</script>

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

Ответ 6

мы можем просто сделать это так:

$(this).find(":selected").data("id")

Ответ 7

так просто, используя jquery api [протестировано на версии select2 4.x]

$('#select').on('select2:select', function (e) {
    let id = $(e.params.data.element).data('id');
});

Ответ 8

Я использую select2 для динамической загрузки всех своих опций (из массива), и это то, что я смог успешно использовать:

$('#element').select2('data')[0].dataAttribute;

где id выбора - 'element', а dataAttribute - это пользовательский атрибут для опции, которую я пытаюсь получить.