ASP.NET MVC多个选择列表框值无法呈现

时间:2017-07-22 18:20:36

标签: javascript c# html asp.net-mvc-4

我有2个单选择下拉列表和1个多选列表框。以下是html中的代码。我首先从第一个下拉列表中选择了值(单选)。根据它的值加载了第二个下拉值。然后我从第二个下拉列表中选择了一个值。理想场景是根据第二个下拉值第三个多选列表框应该加载值。我遇到了一个奇怪的行为。即使在HTML select中显示选项值,但在渲染时它显示No Results。

 <div class="row sub-container">
            <div class="sub-heading">Filter supplier / service provider by categories</div>

            <div class="form-group clearfix">
                <label class="form-label col-md-3">Services Categories Level 1</label>
                <div class="col-md-9">
                    <section id="section-examples" class="attireBlock mod1">
                        <div class="">
                            <div class="">
                                @Html.DropDownList("addServiceServiceCategoryLevel1", Model.ServiceCategoryList, "Please select a Category", new { @class = "form-control" })
                            </div>

                        </div>
                    </section>
                </div>
            </div>

            <div class="form-group clearfix">
                <label class="form-label col-md-3">Services Category Level2</label>
                <div class="col-md-9">
                    <section id="section-examples" class="attireBlock mod1">
                        <div class="">
                            @Html.DropDownList("addServiceServiceCategoryLevel2", new SelectList(string.Empty, "Id", "Name"), "Please select a Category", new { @class = "form-control" })
                        </div>
                    </section>
                </div>
            </div>

            <div class="form-group clearfix">
                <label class="form-label col-md-3">Services Category</label>
                <div class="col-md-9">
                    <section id="section-examples" class="attireBlock mod1">

                        <div class="fstElement fstMultipleMode fstNoneSelected">


                            @Html.ListBox("addServiceServiceCategory",new SelectList(string.Empty, "Id", "Name"), new { @class = "multipleSelect", @multiple = "" })
                        </div>
                    </section>
                </div>
            </div>

 $(document).ready(function () {

               $('.multipleSelect').fastselect();


  $("#addServiceServiceCategoryLevel2").on("change", function () {  // whenever a selection is made
        $("#addServiceServiceCategory").empty();

        var id = $("#addServiceServiceCategoryLevel2").val();

        $.ajax({
            type: 'POST', // we are calling json method
            url: "/ServiceProviders/GetServiceCategoryLevel2",
            dataType: 'json',
            data: { id },
            success: function (states) {

                $.each(states, function (i, state) {
                    $("#addServiceServiceCategory").append('<option value="' + state.Value + '">' +
                        state.Text + '</option>');
                });
            },
            error: function (ex) {
                alert('Failed to retrieve states.' + ex);
            }
        });
        return false;
    });

});

enter image description here

1 个答案:

答案 0 :(得分:1)

我认为您的问题是因为您在>初始化为win_shell

后更新选项

因此它没有接受新的改变

尝试重新初始化一次ajax成功加载数据

如下所示:

fastselect