两个表单使用相同的字段和按钮提交答案

【问题标题】：Two forms same using same field and button submit两个表单使用相同的字段和按钮提交
【发布时间】：2013-05-29 05:09:12
【问题描述】：

这个案子有点麻烦：

我有两个使用相同字段的表单。我想当用户单击“下载”按钮时，该表单将提交到下载表单。
如果用户单击“立即尝试”按钮，此表单将从下载中获取数据（如果有）并提交到“立即尝试”表单。

为什么我需要将具有相同字段的两个提交到一个操作：正如您在这些表单的底部看到的那样。我有一个输入隐藏字段“mkt_key”，因为这个键会在页面加载时通过制作工具生成，并且每个表单都会有这个字段的唯一值。所以，这就是为什么我需要提交 2 个表单，因为它需要营销工具来跟踪。

您可以查看我的来源：[here](http://jsfiddle.net/n2lose/8qVEv/)

【问题讨论】：

标签： forms button submit

【解决方案1】：

我无法使用您提供的链接查看源代码。我假设问题有点像我在下面提到的并提供解决方案。

您可以使用 jquery 为您完成。

html:

<form id="myForm">
<input name="samefield1"/>
<input name="samefield2"/>
<input name="samefield3"/>
<input name="samefield4"/>
<input type="button" id="btn_dload" value="Download">
<input type="button" id="btn_try" value="Try Now">
</form>

jquery 代码：

$(function(){
 $("#btn_dload").click(function(){
var data   $("#myForm").serialize(); // this will serialize form data like 

                                 // samefield1=value1&samefield2 = value2;
    $.ajax({
      data: data,
      url: 'the download form submission url',
      type: 'post',
      success: yourcallback();
    });
     });
     $("#btn_try").click(function(){
    var data   $("#myForm").serialize(); // this will serialize form data like 
                                 // samefield1=value1&samefield2 = value2;
    $.ajax({
      data: data,
      type: 'post',
      url: 'the try now form submission url',
      success: yourcallback();
    });
     });


});

【讨论】：

【解决方案2】：

我的意思是：我有一个表格如下：

<div class="form">
    <form method="post" action="index.php" id="app_1065" name="app_1065">
        <input type="text" value="samefield" />
        <input type="text" value="samefield" />
        <input type="text" value="samefield" />
        <input type="text" value="samefield" />
        <!-- Key will be render when runtime and loading page -->
        <input type="hidden" name="key" value="dloadform" />

        <input type="button" id="btn_dload" value="Download">
        <input type="button" id="btn_try" value="Try Now">
    </form>
</div>

<script>
    $("#btn_dload").click(function(){
        var formDownload = $(".form").find("form:first");
        document.getElementById('mktForm_1065').submit();
        return false;
    });

    $("btn_try").click(function(){
        var formTryNow = $(".form").find("form:first");
        $(formTryNow).attr("id", "app_1160");
        $(formTryNow).attr("name", "app_1160");
        $(formTryNow).find("input[name='mkt_key']").val("tryform");
        document.getElementById('app_1160').submit();
        return false;
    }); 
</script>

说明：如果用户点击下载表单，它将提交表单id/name 为app_1065，key="download" 默认。如果用户单击按钮立即尝试，它将在提交表单之前使用新的 id、名称和尝试立即表单的键更新表单。

问题： - 现在下载表单默认正常工作。但我不明白为什么更新新的 id、name 和 key 后 try now 表单不起作用。

【讨论】：