I am trying to created a dynamic multiselect dropdown. The below code is not working
<div class="form-group">
@Html.Label("Solutions", htmlAttributes: new { @class = "control-label col-md-4" })
<div class="col-md-8">
@Html.DropDownListFor(model => model.SolutionList, new SelectList(new List<SelectListItem>(), "Value", "Text"), new { multiple = "true", @class = "form-control list-group-active-color", Style = "width:100% !important", onchange = "OnGetSolutionsChange(this)" })
@Html.ValidationMessageFor(model => model.SolutionList, "", new { @class = "text-danger" })
</div>
</div>
var solutionOptions = "";
jQuery(result).each(function () {
solutionOptions += "<label><input type='checkbox' name='categories' value='" + this.Value + "'>" + this.Text + "</input></label>";
});
target.append(solutionOptions);
target.multiselect('rebuild')
This solved my problem:
jQuery("#SolutionList").multiselect('destroy');
jQuery("#SolutionList").multiselect();
jQuery(result).each(function () {
$("#SolutionList").append('<option value="' + this.Value + '">' + this.Text + '</option>').multiselect('rebuild');
});