2形式的一个提交按钮

问题描述：

我试图提交2点形成了一个提交按钮，但它不工作，我只得到了第二个表格，请帮我这是代码的jQuery：2形式的一个提交按钮

$('#BTN1').click(function() { 
    $('#form1').submit(); 
    $('#form2').submit(); 
});

只能提交每个请求一种形式 – Jer

，你可以在2倍不同的目标 – Laurianti

在哪个平台上，你的工作提交？我的意思是PHP或ASP.NET？ – TanvirArjel

答

发生这种情况是因为只有一个请求会将其发送到服务器。当您提交第一份表格时，第二份表格会中断并启动。

您需要以不同的方式处理它。先用第一种形式做一些事情（自己发送一个AJAX请求，而不是依靠浏览器），等到它完成，然后从第二个开始。

由于AJAX请求是异步的，你甚至可以并行执行它们。

除非两种形式都配置了自定义目标或实际触发AJAX请求，否则只是等待是不够的：如果第一个表单成功提交，页面将重新加载，并且JS将停止运行。 – IMSoP

是的，你是对的。我的意思是你必须通过AJAX请求自己完成提交。 – kbariotis

对。在这种情况下，当然，您不需要等待，因为AJAX中的A代表“异步”。 – IMSoP

答

为什么不阿贾克斯提交表单...

$('#BTN1').click(function(e) { 
$.ajax({ 
      type: "POST", 
      url: UrlToPost, 
      data: $('#form1').serialize(), 
      success: function(msg) { 
      } 
}) 

$.ajax({ 
      type: "POST", 
      url: UrlToPost, 
      data: $('#form2').serialize(), 
      success: function(msg) { 
      } 
}) 
});

//请注意，您BTN1不应该是一个类型提交，否则将刷新页面..或者你可以把

e.preventDefault()

作为您的点击功能中的第一行..以避免重复使用

尽管这是一个明智的建议，但您需要提供更多关于这将如何工作的详细信息，以便成为有用的答案。 – IMSoP

@IMSoP同意..编辑我的答案:) ..希望你删除downvote – Aniket

这不是我的downvoted，但无论如何都有upvote :) – IMSoP

答

正如在其他答案中所述，一旦浏览器成功提交表单，当新页面负载。所以一旦form1提交，在脚本中发生的所有事情都会丢失。

有几种不同的方法可以处理这个问题。由于您的标签表示您使用的是jQuery，因此您可以轻松使用ajax发布表单，等到它们都完成后，再切换到任何您想要的新网址。

$('#BTN1').click(function() { 
    var form1done = false; 
    var form2done = false; 
    $.post($('#form1').attr('action'), $('#form1').serialize()) 
     .done(function(r) { 
      form1done = true; 
      if(form2done) 
       location.assign('/target/location'); 
     }).fail(function() { 
      // handle error 
     }); 
    $.post( $('#form2').attr('action'), $('#form2').serialize()) 
     .done(function(r) { 
      form2done = true; 
      if(form1done) 
       location.assign('/target/location'); 
     }).fail(function() { 
      // handle error 
     }); 
});

看看在$.post文档和.serialize以获取更多信息。

这就是说，这仍然是一个笨拙的方式来运行一个页面。你可能更适合重构一个表单，或者完全使用ajax，并在同一页面处理表单提交的结果。

最后一个办法是让他们在打开新窗口，以改变你的形式target属性。这将允许他们两人完成提交。

非常感谢你 – Badrane

2形式的一个提交按钮

相关推荐