Блог

Я только что внедрил bootstrap-select в свой проект, но у меня возникла проблема с ним. В моем проекте есть выпадающие меню для отделов и местоположений. Список местоположений заполняется на основе выбора выпадающего списка отдела. После добавления selectpicker класса в выпадающий список location он больше не заполняется данными. Я предполагаю, что этот плагин каким-то образом изменяет выпадающий список, что приводит к тому, что это происходит.

Javascript:

 $(function () {
    $("#SelectedDepartment").change(function () {
        var self = $(this);
        var items="";
        $.getJSON("@Url.Action("GetLocations","Incident")/"   self.val(),
        function(data){
            $.each(data,function(index,item){
                items  = "<option value='"   item.Value   "'>"   item.Text   "</option>";
            });
            $("#SelectedLocation").html(items);
        });
    });
});
  

Вид:

 <div class="row">
    <div class="form-group col-sm-6">
        Incident department/location:
    </div>

    <div class="form-group col-sm-6">
        @Html.LabelFor(model => model.Departments, htmlAttributes: new { @class = "control-label col-md-4" })
        <div class="col-md-10">
            @Html.DropDownListFor(x => x.SelectedDepartment,
                                new SelectList(Model.Departments, "Value", "Text"), new { @class = "selectpicker", @title = "Select a Department"})
            @Html.ValidationMessageFor(model => model.Departments, "", new { @class = "text-danger" })
        </div>

        @Html.LabelFor(model => model.Locations, htmlAttributes: new { @class = "control-label col-md-4" })
        <div class="col-md-10">
            @Html.DropDownListFor(x => x.SelectedLocation,
                                new SelectList(Model.Locations, "Value", "Text"), new { @class = "", @title = "Select a Location" })
            @Html.ValidationMessageFor(model => model.Locations, "", new { @class = "text-danger" })
        </div>
    </div>
</div>
  

Просто используй это :

 $('#SelectedLocation').selectpicker('refresh');