How to set Default Value in tagging in select2 jquery

Question

I am using select2 (http://ivaynberg.github.io/select2/) for my tagging input. from the example in using select2 tagging the code is look like this.

 $("#e12").select2({tags:["red", "green", "blue"]});

now my problem is how can I insert default value in my input just like in the page example in http://ivaynberg.github.io/select2/ at Tagging Support, the input has a default value of 'brown', 'red', & 'green'.

Lunseth

Answer 1

You can initialize the Select2 control by providing a value for the hidden input:

<input type="hidden" id="e12" value="brown,red,green" />

And you can set the value of the Select2 control by passing an array to the 'val' method:

$('#tagSelect').select2('val', ['brown','red','green']);

jsfiddle demo

Dawkins

@Fortis - Thanks for the notice. I fixed the external resource inks in the fiddle so it works again. – Dawkins

yeah sorry i really should have done that myself but busy doing something else so I just said Id give you a heads up. – Fortis

Answer 2

Updated version

Say you initialized your select like this:

$('.mySelect').select2({
  multiple: true,
  tags: "true"
});

Then use this 2 functions for triggering the change. (as seen in the official documentation)

$('.mySelect').val(['value1', 'value2']);
$('.mySelect').trigger('change.select2');

Where "value1" and "value2" are IDs of the option elements of the select.

Predial

Answer 3

For Select2 4.0 I had to add the data attribute to select2 and also set value and trigger change, like this:

$('#mySelect').select2({
  data: ['one','two'],
  tags: true
});
$('#mySelect').val(['one','two']).trigger('change')

Breann