Question

我正在尝试使用ajax，以便仅更新部分视图而不是整个视图。在以下示例中，我想刷新页面内容部分。

这是我的layout.html。

<body>
    <div id="container" class="effect">
    @Html.Partial("_head")

    <div class="boxed">
        <section id="content-container">
            @if (ViewData["Errors"] != null)
            {
                <div class="panel" style="background-color:white;">
                    <div class="panel-heading">
                        <h3 class="panel-title">
                            Page title
                        </h3>
                    </div>
                </div>
            }
            <div id="page-content" class="container">
                @RenderBody()
            </div>

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

部分视图_head包含带有href链接的菜单，例如：

<a id="a1" href="">Menu Item 1</a>

在布局中我试图使用以下内容：

<script>

$(document).ready(function () {

    $("#a1").click(function () {
            A1();
    });

        function A1( ) {
            $.ajax({
                url: '@Url.Action("PartialViewMethodFromController", "HomeController")',
                success: function (response) {
                    $('#page-content').html(response);
                }
            });
        } 
});
</script>

和我的HomeController

    public ActionResult PartialViewMethodFromController()
    {

        var model = service.GetAll();
            return PartialView("PartialViewMethodFromController", model);

}

它有点工作 - 部分视图刷新片刻，部分视图显示正确，然后整个页面继续并刷新。我错过了一些关键的东西吗？

如何使用Ajax更新RenderBody（）

0 个答案: