I am doing a select box listing with select2 ajax. I can list the data from the server but it is not listed in the selectbox. How can I solve this problem?
HTML
<input type="hidden" class="js-data-example-ajax form-control" />
jQuery
$(".js-data-example-ajax").select2({
minimumInputLength: 3,
ajax: {
url: "/Contacts/Test1",
dataType: 'json',
delay: 250,
data: function (params) {
return {
"temp": params,
};
},
results: function (data) {
console.log(data)
debugger;
var parsed = [];
try {
parsed = $.map(data.data, function (item) {
console.log(item)
return {
ID: item.ID,
ADI: item.ADI
}
}).value();
} catch (e) {
}
console.log(parsed);
return {
results: parsed
};
},
cache: false
}
});
if you getting the array as ajax response then do iterate the response and add it in the option and finally append it to the select box. eg html:
<select class="test-select"></select>
eg: js
for(var i=0;i<response.length;i++) {
var optionData = $("<option>"'+ response[i].id +'"</option>");
$('.test-select').append(optionData);
}
here create the option using jquery and append each option to the select
try it...