用于 ASP.NET MVC 3 的 jquery ajax 表单

Posted 2023-05-08

【中文标题】用于 ASP.NET MVC 3 的 jquery ajax 表单

【英文标题】：jquery ajax forms for ASP.NET MVC 3

【发布时间】：2011-06-27 00:19:31

【问题描述】：

这可能是一个简单的问题，但对我来说现在还不清楚，我必须把事情整理好......也许有人可以帮我解决这个问题=）......

我知道 MVC 带有 Ajax Helpers。 我知道有 Microsoft 库，也有 jquery。 我知道他们在 MVC 3 中引入了不显眼的 javascript，它为 html 添加了一些特殊标签以进行清洁......

但是ist如何一起玩呢？

示例：我想为每个 ajax 发布一个远程表单（部分视图）以将 cmets 添加到博客文章中。而不发回整个页面。

在我的部分视图中，我会使用Ajax.BeginForm()，然后是 MvcAjax 还是 Jquery？ 或者我会使用Html.BeginForm() 并在表单的点击事件上注册类似 $.post 的东西。如果禁用或不支持 javascript，这也会有一个纯 html 的后备......

或者一般来说，什么时候使用什么来将 cmets 发布到博客帖子？...我认为这是正确的，我发布到 cmetscontroller 的创建操作，我会使用 JsonModelBinder 将其转换为一个模型。之后我会返回 Json 并将其附加到我的 cmets 列表中......

这样做的理由合理吗？

【参考方案1】：

Ajax.BeginForm() 是 MvcAjax 还是 Jquery？

默认情况下它是 jquery。您需要引用 jquery.unobtrusive-ajax.js 脚本才能使其工作。

或者我会使用 Html.BeginForm() 并在表单的点击事件上注册 $.post 之类的东西。

这是另一种选择。我个人就是这样做的。

我认为这是正确的，我将发布到 cmetscontroller 的创建操作，并且我会使用 JsonModelBinder 将其转换为模型。之后我会返回 Json 并将其附加到我的 cmets 列表中......

JsonModelBinder 已在 ASP.NET MVC 3 中引入，它允许您将 JSON 字符串发送到控制器操作，该控制器操作将被映射回视图模型。例如，如果您有以下视图模型：

public class PersonViewModel

    public string Name  get; set; 
    public int Age  get; set; 

以及以下操作：

public ActionResult Foo(PersonViewModel person) 

    ...    

在 AJAX 中调用它的传统方式是：

$.ajax(
    url: '@Url.Action("foo")',
    type: 'POST',
    data:  name: 'john', age: 20 ,
    success: function(result) 
        // TODO:
    
);

在 ASP.NET MVC 3 中，您可以发送一个 JSON 作为请求参数，该参数将绑定到 PersonViewModel 操作参数：

$.ajax(
    url: '@Url.Action("foo")',
    type: 'POST',
    contentType: 'application/json',
    data: JSON.stringify( name: 'john', age: 20 ),
    success: function(result) 
        // TODO:
    
);

【讨论】：

请注意，如果您使用通过捕获提交事件从表单获取的数据发布到 MVC，例如$("#some_form").submit(function () var data = $(this).serialize(); ... $.ajax(... Darin 示例中的内容类型应该被删除才能正常工作在那种情况下。

有趣！我会看看 JsonModelBinder。

我必须说，很好的答案。它节省了我 2-3 个小时。谢谢@Darin Dimitrov