hi, i use:
https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.4/js/select2.min.js
my html:
<select name="serv_id" id="serv_id" class="form-control select2s" style="width: 100%;"></select>
initilalization:
$('.select2s').select2({
placeholder: 'Select an service',
ajax: {
url: '_get_services.php',
dataType: 'json',
delay: 250,
/*
processResults: function (data) {
//console.log(data);
return {
results: data
};
},
*/
processResults: function (data) {
return {
results: $.map(data, function (obj) {
return {
id: obj.id,
text: obj.text,
price: obj.price
};
})
};
},
cache: false
}
});
both processResults work correct with:
var data=$("#serv_id").select2('data')[0];
console.log(data.price);
when i try code from documentation - https://select2.org/programmatic-control/add-select-clear-items#preselecting-options-in-an-remotely-sourced-ajax-select2
var sSelect = $('.select2s');
$.ajax({
type: 'GET',
dataType: 'json',
url: '_get_service.php?sid=<?=$row_p["serv_id"];?>'
}).then(function (data) {
console.log(data);
// create the option and append to Select2
var option = new Option(data.text, data.id, true, true);
$('.select2s').append(option).trigger('change');
// manually trigger the `select2:select` event
sSelect.trigger({
type: 'select2:select',
params: {
data: data
}
});
});
console log shows correct values but select is not changed.
On http://offers.balkanecommerce.com/t.php you can check that ajax get initial val but select not changed.
Best wishes, T