CODEWITHSUNDEEP
javascriptjqueryjquery-select2select2-rails
aldrien.h
aldrien.h

Reputation: 3615

How to reset specific selected option in select2

For example i have 2 records pre-selected as seen in screenshot below.

I noticed that aria-selected="true" for selected ones.

How can I find it by title and remove/reset it so it will not be part of current selected items.

Thanks in advance.

enter image description here

Upvotes: 0

Views: 1886

Answers (2)

Corentin MERCIER
Corentin MERCIER

Reputation: 162

I think this should work:

$('#idSelect option[title="myTitle"]').first().remove();

Hope it helps.

Upvotes: 1

Alex
Alex

Reputation: 1423

select2 has link to particular <select> element in DOM. So, first you need to change select option, and then trigger change event of select2
For change option text you can like this

<select id="mySelect">
  <option value="option1">Text</option>
</select>

var $select2 = $("#mySelect").select2();
$('#mySelect option[value="option1"]').text = 'Another text';

And then trigger change event for select2:

$select2.trigger("change");

Remove item

$('#mySelect option[value="option1"]').remove();
$select2.trigger("change");

Select one option

$select2.val("option1").trigger("change");

Select multiple options

$select2.val(["option1", "option2"]).trigger("change");

Remove one from selected

If you need remove one option from already selected, you need to get selected options, remove one, and set new options to select2.

var sel = $select2.val(); // array
sel.splice(sel.indexOf("option1"), 1);
$select2.val(sel).trigger("change");

Upvotes: 0

Related Questions