在jQuery对话框中的MVC中常用的方法

Question

似乎有几种方法可以将jQuery对话框与ASP.NET MVC集成.是否有一种特定的方法成为普遍接受的最佳实践方法？

作为一个例子:我有一个列表页面,点击任何列出的项目的"编辑"在jQuery对话框中打开一个表单,填充项目的详细信息.用户编辑详细信息并单击"保存".如果保存在服务器端成功,则关闭对话框并使用新数据重新构建列表.如果在服务器端保存失败,则对话框保持打开状态并向用户显示错误消息.

1. No-JSON方法:每个"编​​辑"链接都是"编辑"控制器操作的HREF.该控制器操作构建一个与"列表"视图相同的视图,此外它还包括一个部分操作来构建编辑表单,填充它,并定义javascript以将其作为jquery对话框弹出."保存"是一个形式的帖子; 如果成功,它会将重定向操作返回到列表页面.如果失败,它将重建整个页面(包括在对话框中弹出的表单),同时显示错误消息.
2. 全JSON方法:列表页面呈现一个空的编辑表单(隐藏),准备弹出一个对话框."编辑"链接调用本地javascript,它执行ajax请求以获取完整对象(我定义了一个控制器,它将完整对象作为JsonResult返回).成功时,它使用对象的数据填充编辑表单并打开对话框."save"链接调用本地javascript,它将表单数据捆绑到json对象中,并使用该json对象作为有效负载调用post操作(我定义了一个控制器,它需要该对象,尝试保存,并返回一个指示成功的JsonResult /失败+ errorMessages).来自ajax请求的成功回调会评估返回的对象,并在仍然打开的jquery对话框中显示错误消息,或者关闭对话框并重新加载"list"页面以获取列表中的新数据.
3. [编辑] Ajax-HTML方法:刚刚看到这个SO讨论描述了另一种方法."编辑"调用本地javascript,它执行ajax发布以获取对话框的完整HTML(我会编写一个返回部分视图的控制器:完全填充的表单).它将返回的HTML呈现为jquery对话框,并且还"重新连接"表单提交以执行表单内容的ajax-post(我将编写一个httpPost控制器,与上面的#2相同).成功回调会评估响应并填充错误消息或关闭对话框.
4. 我还没有想过其他一些很酷的方法？

选项1似乎更符合"纯粹的"ASP.NET MVC.但是,它似乎具有大的HTTP有效负载(因为我们在每个请求时将整个页面发送回浏览器),并且服务器端性能较慢(因为我们在每个请求上重新构建列表).

选项2似乎与更现代的基于Ajax的Web应用程序(更小的HTTP有效负载,更细粒度的操作)更加一致.但是,似乎许多控制器都是JSON控制器,我将编写大量客户端代码来编组来自JSON对象的数据到/从表单字段,显示错误消息等.它似乎也像我我会错过许多很酷的MVC功能,比如EditorFor()和ValidationMessageFor().它只是"感觉"就像我正在使用MVC系统而不是它.

[编辑:添加选项3]选项3似乎是1和2之间的混合.我使用"纯"MVC方法来构建和填充表单,并返回完整格式的HTML FORM标记.将HTML返回到ajax请求感觉很奇怪,因为它很冗长,但我可以克服它.后期操作很好,紧凑的JSON比ajax"感觉"更好.但是,不幸的是,有效负载对象是FormCollection而不是真正的viewmodel对象.看起来我可以使用一些MVC便利(EditorFor())而不是其他(ValidationMessageFor()).

我正在寻找"正确"的方式来做到这一点,而不仅仅是最快的方式来破解它.是的,是的,我知道没有普遍的"正确"方式.但我确信有一些明显错误的方法,我想避免它们.

我在ASP.NET/C#中很有经验,但我对MVC很新.在此先感谢您的帮助!

[编辑] - 杰出的回答 - 我希望我可以奖励多个答案/赏金,因为我发现几个回复非常有用.但是,由于我不能,我将最高投票的答案标记为答案.再次感谢所有受访者!

Answer 1

我和我的团队在编写支持AJAX的MVC应用程序方面有很多经验,我们使用了所有3种方法.

但是,我最喜欢的是AJAX-HTML方法 - 使用a PartialView来呈现对话框的内容,其中可能包括服务器端验证消息和任何其他逻辑.

这种方法的最大好处是关注点的分离 - 您的视图始终负责呈现HTML,并且您的JavaScript不必包含呈现JSON所需的任何文本,标记或"模板".

另一大优势是所有伟大的MVC功能可用于渲染HTML:强类型的意见,HtmlHelper,DisplayFor和EditorFor模板DataAnnotations等,这使得它更容易保持一致,并赋予很好地重构.

请记住,没有必要坚持单一的方法.当你的AJAX调用只需要一些简单的东西,比如像"成功"这样的状态更新时,只需使用string或JSON传达这些消息即可.PartialViews在需要HTML时使用,并在需要通信时使用更简单的方法.