一个带有两个提交按钮和每个按钮的不同操作的表单答案

【问题标题】：One form with two submit buttons and different actions for each button一个带有两个提交按钮和每个按钮的不同操作的表单
【发布时间】：2013-02-08 03:23:20
【问题描述】：

我花了几个小时试图找到解决问题的方法，但似乎找不到合适的解决方案。提前感谢您的帮助！

我有一个 html 表单：

<form id="columnarForm"  action="formindb_hoh_1.php" enctype="multipart/form-data" method="post" />

我想要两个提交按钮：

<input type="image" name="camper" value="camper" src="../images/apps/camperBtn.png" class="submit_button" />
<input type="image" name="medical" value="medical" src="../images/apps/medicalBtn.png"class="submit_button" />

我希望第一个提交按钮在单击时具有formindb_hoh_1.php 的动作，而第二个提交按钮具有formindb_hoh_2.php 的动作，但我不确定如何使一个按钮具有一个动作并具有另一个按钮有不同的动作。

【问题讨论】：

使用javascript提交
@Nick：正如 Arun Killu 指出的，你可以使用一些 Javascript 吗？
@ArunKillu，如果我不需要的话，我宁愿不使用 javascript。我担心那些阻止了 javascript 的人...

标签： php forms

【解决方案1】：

没有 JS，使用 HTML5。

更改提交按钮以使用新的 HMTL5 按钮属性formaction：

<button type="submit" name="camper" formaction="formindb_hoh_1.php">Camper</button>
<button type="submit" name="camper" formaction="formindb_hoh_2.php">Medical</button>

参考：http://devdocs.io/html/element/button

【讨论】：

这应该是公认的答案！刚刚测试过，效果很好！关于浏览器/设备兼容性的任何说法？
我想知道这如何与 ASP.NET MVC 表单交互，因为表单操作是在表单本身而不是单个按钮上指定的。
在 IE 版本 9 之前无法使用。需要在您的网站上放置消息：Update your browser.
该死的，看起来很不错，但兼容性看起来很糟糕。仅限 IE 10 :( 请注意 IE 几乎消失了 :) 但 Firefox 看起来是一个真正的问题，仅从版本 4 开始支持（请注意，使用统计信息无处不在）。很想用这个，但我想我会去 JS，然后在 JS 关闭时受苦。

【解决方案2】：

参考这个：

Multiple submit buttons php different actions

将此脚本放在您的页面中：

<script>
    function submitForm(action)
    {
        document.getElementById('columnarForm').action = action;
        document.getElementById('columnarForm').submit();
    }
</script>

修改你的输入代码：

<input type="image" name="camper" onclick="submitForm('formindb_hoh_1.php')" value="camper" src="../images/apps/camperBtn.png" class="submit_button" />
<input type="image" name="medical" onclick="submitForm('formindb_hoh_2.php')" value="medical" src="../images/apps/medicalBtn.png"class="submit_button" />

【讨论】：

OP 想要完全发布到不同的脚本。
并确保使用关闭表单

【解决方案3】：

我花了一个多小时终于得到了答案。我尝试了各种方法，例如 switch case、jquery 和 JavaScript。但我只使用了 HTML5 formaction 标记，现在我的表单两个提交按钮在两个位置工作。

代码：

   <input type="submit" class="btn btn-success" value="Pay Now" name="submit"  style="width: 100%; letter-spacing: 1px; color: #fff; border: none;padding:  10px;" formaction="example.php">

   <button type="submit" class="btn btn-success" name="submit" style="width: 100%; letter-spacing: 1px; color: #fff; border: none;padding: 10px; margin-top: 15px;" formaction="mail.php"> Button</buttton>

【讨论】：

【解决方案4】：

我也有同样的问题。但问题是第一个按钮功能是在 JS 中，而另一个是使用 PHP。

$('#add-bookingid').submit(function(e){
e.preventDefault();
calculateDistance();
});

您会看到 $('#add-bookingid').submit ，因此两个按钮的按钮类型与提交相同。

Main Purpose

Button# 1

Button# 2

【讨论】：