This little jquery function will add options to a select2
$.fn.select2AddOptions = function(options) {
this.each(function(){
var $ele = $(this);
var data = $ele.data('select2');
if(data) //the $.extend is not recursive change the false for true if needed
$ele.select2($.extend(false,{},data.options.options,options));
});
return this;
}
Then you can use it to add your extra data that are not inside <option>
or select2 data:
$('#element').select2AddOptions(
{data:[{id:{{ location.id }},text:'{{ location.name }}',color:'{{ location.color }}'}]}
).trigger('change');
If you need to change selected element:
$('#element').val(['id1','id2']).trigger('change');
I you need that select2 fire his event when you select option you will need to fire event manualy like this:
$('#element').trigger($.Event('select2:select', {params: {data: [...]}}))