Question

我有一个场景，我正在使用Ajax.ActionLink（）在父视图中调用和加载子视图。我在子视图上有一个调用另一个子视图的按钮。我希望这个子视图也显示在父视图上。

如果我使用Ajax.ActionLink，我可以将子视图加载到调用子视图中，它看起来好像在父视图中，这很好但是按钮为我提供了更多好处，包括在beginform中发送内容并检查提交前的字段。

当用户点击按钮时，它会从两个drowdown列表以及BeginForm中的其他数据发送所选数据，如：

  @using (Html.BeginForm("Action", "Controller", new { courseID = 1001 }, FormMethod.Post, new { @id = "formName", @name = "formName" }))

然而，当视图返回时，它将在不在父视图或调用它的子视图的新窗口中打开。

如何在调用它或父项的子视图中显示部分视图。意思是父母叫孩子A，孩子A叫孩子B.

Answer 1

原因＃2,343,657为什么我鄙视Ajax.*家庭的帮手。它们隐藏了功能，这样当某些东西不像你期望的那样工作时，你就不知道为什么。编写自己的AJAX;你永远不会后悔。

无论如何，这里的问题是Ajax.ActionLink将JavaScript写入为您提供所有这些功能的页面。你没有写过那个JavaScript（显然它甚至不知道它在那里），但它仍然。

现在您已切换到使用Html.BeginForm，JavaScript已经消失，只留下标准HTML表单，导致页面重新加载提交。如果您想要相同的功能，可以使用Ajax.BeginForm。但是，在您运行之前，请抓住机会改进代码并自己编写JavaScript。然后，事情是非常明确的，你（或其他开发人员）永远不会想知道它是如何工作的，因为它正确那里。

您需要做的就是将一个处理程序附加到表单的提交事件，序列化表单，然后通过AJAX发布，然后对响应执行某些操作。我将在这个例子中使用jQuery，因为1）AJAX是你应该使用某种框架来避免一堆重复的样板代码和2）因为它默认带有一个MVC项目，你已经有机会可以使用它。

$(document).ready(function () {
    $('#YourForm').on('submit', function (e) {
        e.preventDefault();
        $.post('/url/to/post/to', $(this).serializeArray(), function (result) {
            // do something with `result`
            // For example, if `result` is a string of HTML, you can just
            // write it out to some element:
            $('#ResultDiv').html(result);
        });
    });
});

如何在按钮点击时加载部分视图？

1 个答案: