select2 v4 - Programmatic set value with ajax option

[marcinmar...@gmail.com]

How I can set value when I use ajax option in select ?

[pcco...@gmail.com]

On Friday, April 10, 2015 at 5:41:44 AM UTC-4, marcinmar...@gmail.com wrote:
> How I can set value when I use ajax option in select ?

I am looking for this answer also. Have a completely ajax application and trying to trigger an ajax lookup when setting the value of a select2 field. I don't think it can be done. :(

[Paul Colella]

On Friday, April 10, 2015 at 5:41:44 AM UTC-4, marcinmar...@gmail.com wrote:

> How I can set value when I use ajax option in select ?

This is the answer I have come up with until I find a better solution.

Do an ajax request to get a select2 data object (id,text, etc..) of the selected value.

Then:

var s2 = $("#selectelement").data('select2');
s2.trigger('select', {
data: objectfromajax
});

This will add the option to your select element and make it selected.

[Kevin Brown]

This recently came up on Stack Overflow a few times:

http://stackoverflow.com/q/30316586/359284

http://stackoverflow.com/q/30209696/359284

If you are using a basic option (id and text only), you can just append the `<option>` to the `<select>` (like you would do without Select2).

    <option value="id" selected="selected">text</option>

And afterwards you would have to trigger the `change` event, so Select2 can react to the new selection.

Using the internal event system to trigger a `select` event also works, but I'd consider it to be undocumented for now. But since you mentioned it, you should be able to just do

    $('#selectelement').select2('trigger', 'query', {

      data: dataObject

    });

Which works for any method on the main Select2 object.

Kevin

--
You received this message because you are subscribed to the Google Groups "select2" group.
To unsubscribe from this group and stop receiving emails from it, send an email to select2+u...@googlegroups.com.
To post to this group, send email to sel...@googlegroups.com.
Visit this group at http://groups.google.com/group/select2.
For more options, visit https://groups.google.com/d/optout.

[Paul Colella]

In my case I'm using addition properties returned by the query, setting other fields on the form with those results, etc, etc... so appending options to the select is not a solution.

Thanks for the trigger query hint. I'll play with that also.

Paul

[sume...@gmail.com]

Dear Paul,
Thanks a lot. I was facing the same issue and as you said simply adding <option> tag wont help as I am using other information (not 'id' and 'text')

Thanks a lot
Sumesh

[Kevin Brown]

Some of you may be interested in the discussion around adding additional attributed to `<option>` tags, for this exact use case.

https://github.com/select2/select2/issues/3116#issuecomment-112976757

Feel free to weigh in on the options, or discuss other ways of doing what you are looking for.

[sume...@gmail.com]

On Friday, April 10, 2015 at 3:11:44 PM UTC+5:30, marcinmar...@gmail.com wrote:
> How I can set value when I use ajax option in select ?

Hi,

I was trying to pragmatically set values in select2(v4) having multiple selection and Ajax
I tried the solution mentioned by Paul, but didn't worked.
But it worked in the case of single-selection select2
This is how I set the data. Please help

var s2 = $("#selectelement").data('select2');
s2.trigger('select', {

data: [{"id":"15","text":"T1"},{"id":"28","text":"T2"}]
});

[devm0...@gmail.com]

Hi Kevin,
Are you able to provide the select2 v4 equivalent of this approach? I have an ajax control that I only have the 'id', and need to make sure the full data with 'text' is pulled from the remote datasource.

Thanks!
Mike

On Tuesday, May 19, 2015 at 1:37:55 PM UTC-4, Kevin Brown wrote:

[4e....@gmail.com]

пятница, 10 апреля 2015 г., 12:41:44 UTC+3 пользователь marcinmar...@gmail.com написал:

> How I can set value when I use ajax option in select ?

Hi all this how I worked it out:

$("#selectelement").select2("trigger", "select", {
data: { id: "1",text:"name" }
});

[ayush...@kaizeninfotech.co.in]

On Friday, April 10, 2015 at 3:11:44 PM UTC+5:30, marcinmar...@gmail.com wrote:

> How I can set value when I use ajax option in select ?

Its not working.

[ayush...@kaizeninfotech.co.in]

Not working

[vlad.a...@gmail.com]

> How I can set value when I use ajax option in select ?

var control = $('#selectControl').data('select2');
var adapter = control.dataAdapter;
adapter.addOptions(adapter.convertToOptions(response));
$('#selectControl').trigger('change');

[saabir...@gmail.com]

On Friday, 10 April 2015 12:41:44 UTC+3, marcinmar...@gmail.com wrote:
> How I can set value when I use ajax option in select ?

// Set up the Select2 control
$('#mySelect2').select2({
ajax: {
url: '/api/students'
}
});

// Fetch the preselected item, and add to the control
var studentSelect = $('#mySelect2');
$.ajax({
type: 'GET',
url: '/api/students/s/' + studentId
}).then(function (data) {
// create the option and append to Select2
var option = new Option(data.full_name, data.id, true, true);
studentSelect.append(option).trigger('change');

// manually trigger the `select2:select` event
studentSelect.trigger({
type: 'select2:select',
params: {
data: data
}
});
});