jquery select2 изменить текст параметра

Могу ли я изменить текст значения параметра? не могу найти как это сделать...

я должен сделать это

$("#select").select2("destroy");
$('#select option[value="' + id + '"]').text(new_text);
$("#select").select2();

заранее спасибо !


person matiazar    schedule 19.05.2016    source источник
comment
извините, может быть, я плохо выразился. Мой код работает... но я хочу решение без разрушения и воссоздания компонента SELECT2   -  person matiazar    schedule 26.05.2016
comment
Пожалуйста, прочитайте мой комментарий в моем ответе ниже. Если вы думаете, что я снова неправильно понял ваш вопрос, пожалуйста, отредактируйте свой вопрос с соответствующим объяснением.   -  person vohrahul    schedule 27.05.2016


Ответы (4)


Боролся и с этим вопросом. Нашел более чистый способ.

var $select = $('.js-select2');

$select.select2({
  templateResult: updateSelectTemplate,
  templateSelection: updateSelectTemplate
})

function updateSelectTemplate(data) {
    var $option = $(data.element);

    return $option.data('display');
}

$('.js-change').on('click', function(e) {
  $select.find('option:first').data('display', 'Some new value');
  $select.trigger('change');
});
select {
  width: 200px
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.2/css/select2.min.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.2/js/select2.min.js"></script>

<select class="js-select2">
   <option data-display="Display 1"></option>
   <option data-display="Display 2"></option>
   <option data-display="Display 3"></option>
</select>

<button class="js-change">Change value</button>

person RassK    schedule 22.02.2019

Попробуй это

$("#select").trigger("change");

Отредактировано По какой-то странной причине в вашем коде у меня работает следующее:

$("#select").select2("destroy");
$('#select option[value="' + id + '"]').text(new_text);
window.setTimeout(function () {
                    $("#select").select2();
                },0);
person vohrahul    schedule 19.05.2016
comment
нет, это вызовет событие изменения... и мне нужно изменить текстовое значение параметра. - person matiazar; 23.05.2016
comment
извините, может быть, я плохо выразился. Мой код работает... но я хочу решение без разрушения и воссоздания компонента SELECT2 - person matiazar; 26.05.2016
comment
Вы, безусловно, можете обновить значения ‹select›, но чтобы отразить изменение в пользовательском интерфейсе с помощью select2, вам нужно будет воссоздать или перезагрузить объект. - person vohrahul; 27.05.2016

У меня была такая же проблема, и я не мог найти решения с помощью API select2. Мой обходной путь состоял в том, чтобы просто нацелиться на элемент <span>, который создается при инициализации select2.

В моем случае мне просто нужно было выбрать первый вариант, это мой код. С некоторой адаптацией вы можете настроить таргетинг на любой понравившийся вам вариант.

$("#select").next().find( '.select2-selection__rendered:first')
person forsvunnet    schedule 02.01.2018

Попробуй это :

Если изменить только название опции

$('#select option:contains("Old Value")').text('New Value');

или если вы хотите изменить его с идентификатором опции

$('#' + yourId).text('New Value);

и, как и другие, вы должны инициировать событие изменения (чтобы уведомить select2 об изменении данных)

$("#select").trigger("change");
person jy95    schedule 24.05.2016