Select2 selects the first option automatically with tags = true

I have a select with some options and i want to avoid that the first option is the selected one, so i do the following and after that i initialize the select2:

<select class='form-control form-control-sm'>
  <option value='100294'>Aguacate</option>
  <option value='400172'>Bundle Editable</option>
  <option value='100291'>Bundle no Editable</option>
  <option value='100260'>Camara</option>
</select>
$('select').val([]);

$('select').select2({
    tags:true
});

The problem is that, for some reason when i set the select2 tag options to true, after typing 2 characters, the first value is automatically selected and i don't know why

Fiddle: https://jsfiddle.net/wolfteam20/2pwkLq6j/1/

Any help would be appreciated

Edit: I think this one is a bug in select2 Issue

Upvotes: 4

Views: 3299

Answers (1)

Eduard Luca
Eduard Luca

Reputation: 6602

I know it's been a while, but there is a workaround for this.

Turns out that if you add an empty <option> to the select tag, and add a placeholder, the issue is fixed.

JSFiddle

Upvotes: 5

Related Questions