Getting select2 to refresh data using ajax on dropdown - asp.net-mvc-5

Question

I have the following JavaScript to populate dropdown list using select2 https://select2.github.io/
It works fine, and populates the list on the first load of the page.
From then on it does not refresh the list even when data is added because it only does the AJAX call once. Even if I reload the page, the dropdown list is not refreshed and the AJAX call is not triggered (unless I close and reopen the browser, then the AJAX call is fired)
Is there a way to undertake the ajax call each time the dropdown is opened. I tried the .on("select2-open") option but didn't have any luck.
Sorry JavaScript is not something I know much about.
$("#Location").select2({
placeholder: "Select a known location", // Placeholder text
allowClear: true, //Allows deselection of chosen address
ajax: {
url: '/AlertInterface/NewAlertLocations', // Where we want the ajax to call
dataType: 'json', // The datatype we are expecting to be returned
type: "GET", //Just a get method
//Data: allows us to pass a parameter to the controller
data: function (query) {
console.log(query)
return { search: query.term }
},
//processes the results from the JSON method and gives us the select list
processResults: function (data) {
console.log(data)
return {
results: JSON.parse(data)
};
}
}
});
EDIT:
I did try to use
$("#Location").on("select2:open", function () { $("#Location").select2(); })
but that didn't help. :-(

Answer 1

You have a syntax error in your code.
Please check the below code,
$("#Location").select2({
placeholder: "Select a known location", // Placeholder text
allowClear: true, //Allows deselection of chosen address
ajax: {
url: '/AlertInterface/NewAlertLocations', // Where we want the ajax to call
dataType: 'json', // The datatype we are expecting to be returned
type: "GET", //Just a get method
//Data: allows us to pass a parameter to the controller
data: function (query) {
console.log(query)
return { search: query.term }
},
//processes the results from the JSON method and gives us the select list
processResults: function (data) {
console.log(data)
return {
results: JSON.parse(data)
};
}
}
});