Question

我是MVC 4和Razor引擎的新手 - 所以这可能是一个愚蠢的问题。

我想要实现的是我有一个带有下拉列表和按钮的页面。单击该按钮会调用控制器传递所选值。控制器应返回局部视图，并且只应更新页面的底部部分。

然而，我发现整个页面只被部分视图html取代。 IE浏览器。我得到了我的结果列表，但是我丢失了项目的下拉列表并提交了按钮。我尝试包含对jquery和不显眼的脚本的引用（我认为我不需要在MVC 4中），但这根本不会改变页面（即，下拉列表和按钮保持在那里并且没有显示结果）。

我的观点的一部分：

@using (Ajax.BeginForm("GetProjectStories", "MyController", new AjaxOptions{ UpdateTargetId = "projectUserStories"}))
{

    <fieldset>
        <legend>Select Project</legend>
        <div>
            @Html.DropDownList("ProjectReference", (IEnumerable<SelectListItem>)Model.ProjectList)
        </div>
        <p>
        <input name="GetStoriesButton" type="submit" value="Get Stories" />
        </p>
    </fieldset>
}

@if (Model != null && Model.UserStories != null)
{
    <div id="projectUserStories">
        @{Html.RenderPartial("_UserStoryList", Model);}
    </div>

}

我的控制器：

public ActionResult GetProjectStories(ProjectViewModel model)
        {

           var stories =  MyService.GetProjectUserStories(model.ProjectReference).Results;   
           model.UserStories = stories;
            return PartialView("_UserStoryList", model);
        }

我的部分视图内容只包含一个html表和对模型的引用。

Answer 1

如何计划更新projectUserStories，如果无法呈现代码块，请尝试以下操作：

<div id="projectUserStories">
@if (Model != null && Model.UserStories != null)
{
   Html.RenderPartial("_UserStoryList", Model);
}
</div>

同时检查Microsoft Ajax助手的所有必需js文件，例如：

<script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.min.js")" type="text/javascript"></script>

另见：

Answer 2

所以我尝试包含那个不引人注目的脚本，并修复了如果该对象为null但它仍然无效的情况下我没有渲染该div的事实。

所以我转而使用jquery。

    <script src="@Url.Content("~/Scripts/jquery-1.7.1.min.js")" type="text/javascript"></script>

    <script type="text/javascript">
            $(function () {
                $('form').submit(function () {
                    var url = "@Url.Action("GetProjectStories", "MyController")";
                    var data = { selectedProject: $('#ProjectReference').val() };

                    $("#projectUserStories").load(url, data, function() {
                    });
                    return false;
                });
            });

     </script>

        @using (Html.BeginForm())
        {
            <fieldset>
                <legend>Select Project</legend>
                <div>
                    @Html.DropDownList("ProjectReference", (IEnumerable<SelectListItem>) Model.ProjectList)
                </div>
                <p>
                    <input name="GetStoriesButton" type="submit" value="Get Stories" />
                </p>
            </fieldset>

            <div id="projectUserStories">
                @{ Html.RenderPartial("_UserStoryList", Model); }
            </div>
         }

MVC 4（剃须刀） - 控制器返回部分视图但整个页面正在更新

2 个答案: