Question

我试图基本上让search.htm的提交按钮能够创建一个带有文本区域的弹出窗口，用户需要输入描述其操作的注释，然后单击弹出窗口中的提交按钮最多可以有效地将两个表单提交到同一个处理页面。 search.htm和frm_comment.htm中的两个表单都将两组数据提交回search.htm，后者在服务器处理逻辑（server.htm）上调用cfinclude。

在下面的代码中，我正在使用“createPeriod”按钮提交“srch”形式的所有内容。它还创建了一个弹出窗口，其中有一个html textarea，允许用户输入注释。有一个原因我需要从注释表单（frm_comment.htm）中拆分主表单，但它非常特定于我正在尝试完成的任务。

search.htm的结构基本如下：

//include the template here to process the forms
<cfinclude template="../server.htm"> 


<cfform method = "post" action = "search.htm" name="srch" format="html">
  <table>
    //bunch of form fields here
                .
                .
                .
                .
    //bunch of form fields here

    <cfinput type="submit" name="createPeriod" value="Create" 
     onClick="ColdFusion.Window.create('comment', 'CommentBox',
     'frm_comment.htm', {center:true,modal:true})">
  </table>
</cfform>

我已尝试将search.htm中的提交按钮更改为cfinput type="button"，因为将其保留为提交会使得评论框会在页面重新加载时显示一小段时间并在页面重新加载后立即消失。但是，在将提交按钮更改为常规按钮时，我无法保留search.htm的表单数据。

我也尝试让我的评论表单的提交按钮的onClick函数调用一个javascript函数来提交两个表单（无效），如下所示：

submitForms = function(){
  document.forms["srch"].submit();
  document.forms["srch1"].submit();
}

<cfinput type="button" name="submitComment" value="Submit" onClick="submitForms()"/>

请告知完成此任务的最佳方法，对于凌乱的代码感到抱歉。

Answer 1

这是一个非常基本的例子，关于如何将2个表单合二为一。当用户点击“搜索”时，JavaScript只会显示评论表单。

<!DOCTYPE html>
<html>
<head>
    <style>
    #hiddenStuff {
        display: none;
    }
    </style>
</head>
<body>

<form action="...">
    // search fields here
    <input type="button" value="Search" onclick="document.getElementById('hiddenStuff').style.display='block';">

    <div id="hiddenStuff">
        // comment form stuff here
        <input type="submit" value="Submit">
    </div>
</form>

</body>
</html>

如果您想查看结果，我还制作了fiddle。

抱歉，我对ColdFusion并不熟悉，但翻译起来应该不会太难：）

如何将2个不同的.htm文件中的两个表单提交到同一个地方

1 个答案: