I'm working on dynamically adding options to a multiselect using AJAX:
<select size='2' name="CraftCode" id=@ccrf class="form-control js-select manualentrydd" ></select>
$.ajax({
type: "GET",
url: "GetCraftCodes",
data: {
JobNum: jobnum.toString()
},
async: false,
content: "application/json; charset=utf-8",
dataType: "json",
success: function(d) {
for (var i = 0; i < d.length; i++) {
$('.manualentrydd').append("<option value=\"" + d[i].craftCodeId + "\">" + d[i].craftCode + "</option>");
}
}
$(".manualentrydd").multiselect("refresh");,
error: function(xhr, textStatus, errorThrown) {
return false;
// TODO: Show error
}
});
This code successfully adds options to my select element. I can see them in the inspect element, but the required list is not showing up and therefore my multiselect is not displaying any options. Here's a screenshot of the inspect element https://i.stack.imgur.com/nZrFt.png