提交表格和处理 [英] Submitting forms and processing

查看:34
本文介绍了提交表格和处理的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我需要能够为多个表单设置一个提交按钮.为了简单起见,我只从我的编码中采用了两种形式.每个表单都有自己唯一的 ID,但除了一些差异之外,每个表单都非常相同.我的问题是只有第一个表单提交成功.我意识到这样做的原因是我的输入字段在每个表单中都有相同的名称,因此它当前无法识别重复的输入字段.有没有办法即使输入字段相同也可以成功提交每个字段,我希望在帮助下我将能够同时提交'input_1'值并将其处理为'form1:input_1'和'form2:input_1'' 分别.预先非常感谢您

I need to be able to have one submit button for multiple forms. I only took two forms from my coding for the sake of simplicity. Each form has its own unique ID, but each form is very much identical to one another save a few discrepancies. My problem is only the first form is submitted successfully. I realize the reason for that is my input fields have the same name in each and every form so it will not recognize a duplicate input field currently. Is there a way that each field can be submitted successfully even though the input fields are the same, I hope that with help I will be able to submit both 'input_1' values and process it as 'form1:input_1' and 'form2:input_1' respectively. Thank you very much in advance

     <body><form name="form1">
     <input type="hidden" name="formID" value="form2"/>
     <input type="hidden" name="redirect_to" value=""/>
     <INPUT TYPE=TEXT NAME="input_1" SIZE=10 />
     <INPUT TYPE=TEXT NAME="input_A" SIZE=15>/<INPUT TYPE=TEXT NAME="input_C"style="width: 1em" maxlength="1"><sup>s</sup>

     <INPUT TYPE=TEXT NAME="input_B" SIZE=10 />
     <INPUT TYPE="button" VALUE="+" name="SubtractButton" onkeydown="CalculateIMSUB(this.form)">
     <INPUT TYPE=TEXT NAME="Answer" SIZE=12>
     <input type="hidden" name="val" value="298" />
     <INPUT TYPE=TEXT NAME="Answer_2" SIZE=4></form>

     <form name="form2">
     <input type="hidden" name="formID" value="form2"/>
     <input type="hidden" name="redirect_to" value=""/>
     <INPUT TYPE=TEXT NAME="input_1" SIZE=10 />
     <INPUT TYPE=TEXT NAME="input_A" SIZE=15>/<INPUT TYPE=TEXT NAME="input_C"style="width: 1em" maxlength="1"><sup>s</sup>

     <INPUT TYPE=TEXT NAME="input_B" SIZE=10 />
     <INPUT TYPE="button" VALUE="+" name="SubtractButton" onkeydown="CalculateIMSUB(this.form)">
     <INPUT TYPE=TEXT NAME="Answer" SIZE=12>
     <input type="hidden" name="val" value="298" />
     <INPUT TYPE=TEXT NAME="Answer_2" SIZE=4></form>
     <input type="submit" name="Submit" id="button" value="Submit" onClick="submitAllDocumentForms()"></body>

Javascript 代码:

Javascript code:

    <script language="javascript" type="text/javascript">
    /* Collect all forms in document to one and post it */
    function submitAllDocumentForms() {
    var arrDocForms = document.getElementsByTagName('form');
    var formCollector = document.createElement("form");
    with(formCollector)
    {
    method = "post";
    action = "process.php";
    name = "formCollector";
    id = "formCollector";
    }
    for(var ix=0;ix<arrDocForms.length;ix++) {
    appendFormVals2Form(arrDocForms[ix], formCollector);
    }
    document.body.appendChild(formCollector);
    formCollector.submit();

    }
    /* Function: add all elements from ``frmCollectFrom´´ and append them to ``frmCollector´´ before returning ``frmCollector´´*/
    function appendFormVals2Form(frmCollectFrom, frmCollector) {
    var frm = frmCollectFrom.elements; 
    var nElems = frm.length;
    for(var ix = nElems - 1; ix >= 0 ; ix--)
    frmCollector.appendChild(frm[ix]);
    return frmCollector;
    }
    </script>

推荐答案

name 不是表单标签的标准属性.我建议您使用 id 来识别您的表单.

name is not a standard attribute for the form tag. I suggest that you use id for identiying your forms.

我尚未测试以下更改,但我希望它们能起作用:

I have not tested the below changes, but I expect them to work:

function appendFormVals2Form(frmCollectFrom, frmCollector) {
    var currentEl;
    var frm = frmCollectFrom.elements; 
    var nElems = frm.length;
    for(var ix = nElems - 1; ix >= 0 ; ix--) {
        currentEl = frm[ix];
        currentEl.name = frmCollectFrom.name + ':' + currentEl.name;
        frmCollector.appendChild(currentEl);
    }
    return frmCollector;
}

这篇关于提交表格和处理的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆