Asp.Net MVC Ajax.BeginForm不通过Ajax

Question

提交

我有我的形式如下

<div id="contact-form" class="hidden" title="Online Request Form"> 
    @Using (Ajax.BeginForm("Contact", "Main", 
          Nothing, 
          New AjaxOptions With {.UpdateTargetId = "status", .HttpMethod = "post"}, 
          New With {.id = "contactUs"})) 
     @<div> 
      @Html.LabelFor(Function(m) m.Name)<br /> 
      @Html.TextBoxFor(Function(m) m.Name)<br /> 
      @Html.LabelFor(Function(m) m.Phone)<br /> 
      @Html.TextBoxFor(Function(m) m.Phone)<br /> 
      @Html.LabelFor(Function(m) m.Email)<br /> 
      @Html.TextBoxFor(Function(m) m.Email)<br /> 
      @Html.LabelFor(Function(m) m.Question)<br /> 
      @Html.TextAreaFor(Function(m) m.Question)<br /> 
      @Html.LabelFor(function(m) m.Security)<br /> 
      @Html.TextBoxFor(Function(m) m.Security)<br /> 
      <noscript> 
       <input type="submit" name="submit" value="Ok" /> 
      </noscript> 
      @Html.ValidationSummary("Oops, please correct the errors.")<span id="status">@TempData("status")</span> 
     </div> 
    End Using 
</div> 

而且我在一个jQuery UI的模态窗口

<script> 
    $(function() { 

     // Open the modal dialog from the div.contact-us click event 
     $('#contact-us').click(function() { 
      $('#contact-form').dialog('open'); 
      return false; 
     }); 

     // Manage the modal dialog behavior. 
     $('#contact-form').dialog({ 
      modal: true, 
      autoOpen: false, 
      buttons: { 
       Cancel: function() { 
        $(this).dialog('close'); 
       }, 
       Ok: function() { 
        $('form#contactUs').trigger('submit'); 
       } 
      } 
     }); 
    }); 

</script> 

打开它当我点击“确定”按钮，它被张贴到适当的控制器，但它不是通过AJAX

''# fix the StackOverflow code coloring issue. 
    <HttpPost()> 
    Function Contact(ByVal contactForm As Models.ContactForm) As ActionResult 
     ViewData("Testimonials") = Helpers.GetTestimonials 

     If ModelState.IsValid Then 
      ''# Submit the email 
      TempData("status") = "Thank you, we will be in touch" 
     Else 
      ''# Return False 
      TempData("status") = "Oops, please correct the errors." 
     End If 


     If Request.IsAjaxRequest Then 
      Return Content(TempData("status").ToString) 
     Else 
      Return View("Index") 
     End If 
    End Function 

发布什么我做错了什么？我提交表单后，我的网址是http://example.com/Main/Contact它告诉我，IsAjaxRequest = false

编辑

即使我不使用jQuery的UI“确定”按钮，只需添加<input type="submit" name="submit" value="Ok" />到表单，表单没有Ajax的帖子

Answer 1

你有jquery ajax脚本吗？我注意到这种行为时，我没有包括它：

<script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.min.js")" type="text/javascript"></script> 

Answer 2

我有一段时间没有与ASP.NET MVC AJAX帮助者一起工作，但我相信Ajax.BeginForm在生成的（HTML）标记中添加了内联onsubmit处理程序。

如果是这样的情况下，调用这种形式编程（你的jQuery触发submit事件）上提交将不会调用形式的onsubmit功能，其中最有可能取消正常提交操作，并通过提交表单AJAX。

有关为什么发生这种情况的更多信息，请查看this related answer。

作为替代方案，您可以通过AJAX使用

• 的jQuery form plugin发布形式。
• jQuery's built-in AJAX function。

我发现这些方法中的任何一种都比使用微软的AJAX帮助程序少麻烦。