在ASP.NETMVC 3 Razor中使用Ajax.BeginForm

Question

在ASP.NETMVC 3 Razor中使用Ajax.BeginForm

是否有教程或代码示例使用Ajax.BeginForm在ASP.NETMVC 3中，是否存在不引人注目的验证和Ajax？

对于MVC 3来说，这是一个难以捉摸的话题，而且我似乎无法使我的表单正常工作。它将执行Ajax提交，但忽略验证错误。

Answer 1

我认为所有的答案都遗漏了一个关键点：如果使用Ajax表单以使其需要更新自身(而不是表单之外的另一个div)，则需要将包含的div放在外表格的。例如：&nbsp;<div&nbsp;id="target"> &nbsp;@using&nbsp;(Ajax.BeginForm("MyAction",&nbsp;"MyController", &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;new&nbsp;AjaxOptions &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;HttpMethod&nbsp;=&nbsp;"POST", &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;InsertionMode&nbsp;=&nbsp;InsertionMode.Replace, &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;UpdateTargetId&nbsp;=&nbsp;"target" &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;})) &nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<!--&nbsp;whatever&nbsp;--> &nbsp;} &nbsp;</div>否则，您将像@david一样结束，结果将显示在一个新页面中。

Answer 2

我最终得到了Darin的解决方案，但首先犯了几个错误，这导致了一个类似David的问题(在Darin的解决方案下面的注释中)，结果是发布到一个新页面。因为在返回该方法后，我必须对表单做一些操作，所以我将其存储起来供以后使用：var&nbsp;form&nbsp;=&nbsp;$(this);但是，这个变量没有Ajax调用中使用的“action”或“method”属性。$(document).on("submit",&nbsp;"form",&nbsp;function&nbsp;(event)&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;var&nbsp;form&nbsp;=&nbsp;$(this); &nbsp;&nbsp;&nbsp;&nbsp;if&nbsp;(form.valid())&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;$.ajax({ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;url:&nbsp;form.action,&nbsp;//&nbsp;Not&nbsp;available&nbsp;to&nbsp;'form'&nbsp;variable &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;type:&nbsp;form.method,&nbsp;&nbsp;//&nbsp;Not&nbsp;available&nbsp;to&nbsp;'form'&nbsp;variable &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;data:&nbsp;form.serialize(), &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;success:&nbsp;function&nbsp;(html)&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;//&nbsp;Do&nbsp;something&nbsp;with&nbsp;the&nbsp;returned&nbsp;html. &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;} &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}); &nbsp;&nbsp;&nbsp;&nbsp;} &nbsp;&nbsp;&nbsp;&nbsp;event.preventDefault();});相反，您需要使用“this”变量：$.ajax({ &nbsp;&nbsp;&nbsp;&nbsp;url:&nbsp;this.action,&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;type:&nbsp;this.method, &nbsp;&nbsp;&nbsp;&nbsp;data:&nbsp;$(this).serialize(), &nbsp;&nbsp;&nbsp;&nbsp;success:&nbsp;function&nbsp;(html)&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;//&nbsp;Do&nbsp;something&nbsp;with&nbsp;the&nbsp;returned&nbsp;html. &nbsp;&nbsp;&nbsp;&nbsp;}});