Search code examples
javascriptjqueryasp.net-mvcbootstrap-multiselect

Dynamic MVC multisect dropdownlist


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')

Solution

  • 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');
        });