Question

我想以某种方式执行一些ajax调用。

我有一个页面。在这个页面中有2个ViewUserControls，比如control1和control2。

control1有一个Ajax.ActionLinks列表，它像这样调用control2：

<%= Ajax.ActionLink(page.Name, "PageDetails", new { pageSysName = page.SysName }, new AjaxOptions { UpdateTargetId = "pageEdit" })%>

control2有一个Ajax表单，可以更新。 Ajax.BeginForm方法如下所示：

Ajax.BeginForm("SavePage", "Admin", new AjaxOptions { UpdateTargetId = "pageEditUpdated" })

当用户点击“保存”按钮时，它当前会从Controller更新名为pageEditUpdated的div，其中包含基本内容（“更新”）返回类型。

我难以理解的部分是如何更新control2以反映新的变化。

总结一下，Page有2个控件。我希望control2刷新自己并更新div以通知用户已执行更新。

Answer 1

让SavePage方法返回反映更新后的表单内容的部分内容，包括更新消息。让更新目标成为表单的“内部容器”。

<% Ajax.BeginForm("SavePage", "Admin", new AjaxOptions { UpdateTargetId = "innerForm" }) { %}
   <div id="innerForm">
   <% Html.RenderPartial( "EditPageContents" ) %>
   </div>
<% } %>

然后您的保存操作将返回

updatedModel.UpdateMessage = "updated";
return PartialView( "EditPageContents", updateModel );

并且您的部分视图应该

<% if (!string.IsNullOrEmpty( UpdateMesage )) { %>
   <%= Html.Encode( UpdateMessage ) %>
<% } %>

老实说，使用jQuery通过AJAX发布表单会更容易：

$(function() {
    $('form').submit( function() {
        $.post( $(this).attr('action'), $(this).serialize(), function(data) {
            $('#updateMessage').html(data).show();
        });
        return false;
    });
});

Answer 2

我必须得到第二个tvanfosson的评论（我会投票给他，但我的声誉显然还不够高）。无论如何，当我将Ajax功能集成到我的MVC网站时，我发现微软提供的Ajax方法相当笨重。所以我转而使用jQuery.form插件（很好的例子here）。我发现它让事情变得更容易。我刚刚为我想成为ajax的页面部分创建了MVC用户控件，并且只是重新加载了该用户控件。

asp.net mvc复杂的ajax更新

2 个答案: