0

我正在开发一个应用程序，它使用 Jquery 来拦截我的表单提交，以代替 Ajax 提交。到目前为止，一切都很好！一切都很好.. 如果客户端没有启用 JS，应用程序将保持完美运行。

好吧，今天我创建了一个新表单，但是 JQuery 不拦截提交。确实，我改变了一点，但仍然如此。它应该工作。

我有一个简单的 PartialView 表单，一个跨度和两个按钮（NO（按钮）和 YES（提交））。我使用 RenderPartial("MyPartial") 到 DIV 和插件 FancyBox 将其显示为模式。根据单击哪个链接以显示模式，我更改表单的操作（报告垃圾邮件或删除项目）和具有特定消息的跨度。就像一条“花哨”的确认信息！！

再说一次，到目前为止一切都很好。我更改了表单操作并且它可以工作（使用警报（form.attr（action）），我使用正确的消息更改跨度并且它可以工作，但是当我单击按钮提交表单（是）时，它会直接进行我提出了一个正常的请求，而不是我想要的 Ajax 请求。

这是表格：

<form id="dialogForm" action="" method="post">
  <div class="form_item_button">
     <span id="dialogQuestion" style="color: Black;"></span>
     <button id="btDialogNo" type="button" value="button" class="btn">No</button>
     <button id="btDialogYes" type="submit" value="Submit" class="btn">Yes</button>
  </div>
</form>

这是拦截表单提交的脚本：

    $(document).ready(function() {
         var theForm = $("#dialogForm");

         // I CHECK IF THE ACTION WAS SET PROPERLY
         // MY TESTS SHOW ME THAT THE ACTION IS OK!
         alert(alert(theForm).attr("action")); 

         theForm.submit(function(e) {
             e.preventDefault();

             $.ajax({
                 type: "POST",
                 data: theForm.serialize(),
                 url: theForm.attr("action"),
                 dataType: "json",
                 success: function(json) {
                     alert(json.Status);
                 },
                 error: function() {
                     alert('An error occurred while processing your request. Please try again.');
                 }
             });
         });

有什么想法吗？我花了整整一天的时间试图修复它！:(

谢谢

4

3 回答 3

0

我注意到您正在使用 a<button>而不是 a<input>作为您的提交按钮。

据我所知，这应该没问题，但是在调用事件处理函数后立即创建一个警报，例如：

    alert(e.attr("id"));

如果它没有返回任何东西，那么问题是单击提交按钮正在触发监听的事件，即正在提交表单。

但是，如果它返回按钮的 id，而不是表单，那么问题可能是您preventDefault在按钮上使用，而不是在表单上使用（反之亦然）。这可以通过简单地使用return false并完全摆脱 来解决e.preventDefault()。

但是，如果以上都不是真的，并且您在点击提交时收到警报，那么问题可能与脚本的时间有关（您正在执行 preventDefault）。

顺便说一句，ajax 是否发生了，但您也收到了表单提交，还是整个函数都被忽略了？

我有一个无论如何都会提交的表单，除非我为验证功能添加了除验证之外的其他内容。最终它与被触发的错误事件有关。我添加的额外工作以某种方式使我正在监听的事件最终赶上了。

于 2010-01-18T06:47:33.680 回答
0

preventDefault()似乎已经过时了。我不确定文档是否已删除，但这是使用submit()事件处理程序获得相同效果的新方法：

 theForm.submit(function(e) {
  blah blah blah
  .............
  return false;
  }

让我知道这是否有效。我肯定很好奇。

于 2010-01-18T01:38:36.667 回答
0

两个问题。

  1. 您用来提醒的线路。
  2. 您在 ajax 调用中缺少一些右括号。

这是代码...

$(document).ready(function() {
         var theForm = $("#dialogForm");

         // I CHECK IF THE ACTION WAS SET PROPERLY
         // MY TESTS SHOW ME THAT THE ACTION IS OK!
         alert(theForm.attr("action")); 

         theForm.submit(function(e) {
             e.preventDefault();
            alert('here');
             $.ajax({
                 type: "POST",
                 data: theForm.serialize(),
                 url: theForm.attr("action"),
                 dataType: "json",
                 success: function(json) {
                     alert(json.Status);
                 },
                 error: function() {
                     alert('An error occurred while processing your request. Please try again.');
                 }
             });
         });
});​​​​

享受。

于 2010-04-29T14:49:19.647 回答