Question

我正在使用MVC4 / EF，我有四个级联下拉列表，我第一次使用它。因此，当第一次呈现页面时，我能够选择第一个下拉列表并在第二个下载过滤结果，并选择第二个下拉列表，第三个dropdwon被过滤，第四个，并根据第四个下拉列表填充编辑视图。但是当我返回并在第一个下拉列表中更改选择时，它会过滤第二个下拉列表，但不会重置第三个，第四个下拉列表和编辑局部视图。这是第一个dropdwon局部视图代码。

CampusUsercontrol.cshtml

@model RHMS.Models.RoomEditor
@using (Ajax.BeginForm("SelectCampus", "RoomEditor", new AjaxOptions { UpdateTargetId  = "Buildings" }))
{ 
@Html.DropDownListFor(
        m => m.SelectedCampusID,
        new SelectList(Model.Campuses,"CampusId", "Name"),
       string.Empty
    )
}

<script type="text/javascript">

$('#SelectedCampusID').change(function () {
    $(this).parents('form').submit();

 });
</script>

Index.cshtml

 @model RHMS.Models.RoomEditor
 @{
ViewBag.Title = "Index";
Layout = "~/Views/Shared/_Layout.cshtml";
 }
   <table cellpadding="0" cellspacing="4" border="0">
<tr>
    <td>Campus </td>
    <td> :</td>
    <td>@Html.Partial("CampusUserControl", Model)</td>
</tr>
<tr>
    <td>Building </td>
    <td> :</td>
    <td><div id="Buildings">@Html.Partial("BuildingUserControl", Model)</div></td>
</tr>
<tr>
    <td>Floor </td>
    <td> :</td>
    <td><div id="Floor">@Html.Partial("FloorsUserControl", Model)</div></td>
</tr>
 <tr>
    <td>Room </td>
    <td> :</td>
    <td><div id="Room">@Html.Partial("RoomUserControl", Model)</div></td>
</tr>
</table>
<div id="RoomInfo">
@Html.Partial("RoomInfoUserControl", Model)
</div>

请帮我修改第一个部分视图时如何刷新其他部分视图。

Answer 1

看起来这部分javascript代码仅在第一次加载页面时执行

<script type="text/javascript">

$('#SelectedCampusID').change(function () {
    $(this).parents('form').submit();

 });
</script>

尝试使用Jquery的on绑定为change连接#SelectedCampusID事件。您可能还必须对其他下拉菜单执行相同的操作。

如何在MVC4 Jquery中重置包含级联下拉列表的局部视图

1 个答案: