【问题标题】:create two form submissions from one button一键创建两个表单提交
【发布时间】:2019-10-31 11:09:45
【问题描述】:

我有一个简单的表单,可以将一些数据提交到 SMS 服务器以发送 SMS。我需要从一个按钮创建两条单独的消息。 message1 需要立即发送,message2 需要延迟,网关支持。

我需要两个不同的“消息”字段,一个有延迟,一个没有。我不认为服务器允许来自一次提交的两个命令。有没有办法让表单从一个按钮按顺序提交?

两条消息共有的字段是:

<form action="https://api-mapper.clicksend.com/http/v2/send.php" method="post">

<input name="key" type="hidden" value="xxxxxxxxx" />

To: <input name="to" type="text" />

<input name="username" type="hidden" value="xxxxxx" />

<button type="submit" >SUBMIT</button>

导致我出现问题的字段是:

<input name="message" value="message1" />
<input name="message" value="message2" name="schedule" value="time" />

【问题讨论】:

  • 表单是发布到第三方,还是发布到与该第三方集成的您自己的后端系统?如果是前者,是否支持 AJAX 请求?
  • 为什么不使用 ajax 来发送 post 请求。也许您可以使用 javascript submit 并在表单中分配 classid
  • 这能回答你的问题吗? Submit two forms with one button
  • 服务器是第三方公司,我无法控制它们。我从未使用过 AJAX - 如果有人愿意提供简短的教程或一些代码,我会欣喜若狂。我只是一个业余爱好者!
  • Diogo - 可能是的。您能帮我为我的表单分配表单 ID 或表单名称吗?

标签: html forms submit


【解决方案1】:

试试这个。

<form id="form1" action="action.php", method="post">
   <input name="key" type="hidden" value="xxxxxx"/>
   <span>To:</span> <input name="to" type="text" />
   <input name="username" type="hidden" value="xxxxxx" />
</form>

<form id="form2" action="action2.php", method="post">
   <input name="message1" value="message1" />
   <input name="message2" value="message2" name="schedule" value="time" />
</form>

<button type="submit" onclick="submitForms">SUBMIT</button>

<!-- add this tag after your body tag -->
<script>
   var submitForms = function() {
      document.getElementById("form1").submit();
      document.getElementById("form2").submit();
   }
</script>

【讨论】:

  • 浏览器将开始提交form1并导航到响应,但由于您立即提交另一个表单,第一个请求将被取消,它将提交第二个表单而不是 (也不是)。
  • 我无法提交第二个表单
  • @Quentin 你能看看 Alvin 的建议吗?
  • @Quentin 是的,是的,我的糟糕,我从来没想过。
  • @billyqureshi,这是因为按钮在 form1 内,并且在尝试发送时,它提交的唯一内容是 form1form2 不会提交,因为只有提交按钮在form1 内执行,这就是它会跳过form2 提交的原因。要解决这个问题,我必须将提交按钮从form1 移开,然后将其放在表单之外。这样,submitForms 函数将成为处理这两种表单的所有 post 请求的函数。
猜你喜欢
  • 2019-03-08
  • 2019-03-18
  • 2014-03-15
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2014-02-06
  • 2018-10-28
  • 1970-01-01
相关资源
最近更新 更多