使用 jquery 以嵌套表单提交子表单

发布于 2024-10-20 08:28:52 字数 1112 浏览 1 评论 0原文

我有一个嵌套表单，看起来像：

    <FORM METHOD="GET" NAME="mainForm"  ACTION=<%=response.encodeURL("updateForm.jsp")%>>

    </FORM>

<t:panel script="showSelect(3)">
      <t:panelTab left="362" width="200px">Tab3</t:panelTab>
    <t:panelBody src="childForm.jsp">
    </t:panelBody>
</t:panel>

子表单代码：

<FORM METHOD="GET" NAME="childForm"  id = "childForm" ACTION=<%=response.encodeURL("processChildForm.jsp")%>>
<span style="padding:0 10px;">
<button class="submitChildFormClass"
        style="width:auto;"
        id="submitChildForm"
        >Process Child Form
</button>
    </span>
</FORM>

我想在单击“submitChildForm”按钮时提交子表单，因此我编写了下面的 jquery 处理程序来执行此操作：

$('.submitChildFormClass').live('click',function() {
    document.getElementById("previewOnlyVal").value = "previewOnly";
    $('#childForm').submit();
});

问题是，当我单击该按钮时，提交主表单而不是子表单。我知道使用嵌套表单不是一个好的编程习惯，但这是旧代码，我们没有太多时间来修改这些代码。谁能告诉我代码中可能缺少什么导致主表单由 jquery 提交？预先感谢您的帮助。

原文

I have a nested form which looks something like:

    <FORM METHOD="GET" NAME="mainForm"  ACTION=<%=response.encodeURL("updateForm.jsp")%>>

    </FORM>

<t:panel script="showSelect(3)">
      <t:panelTab left="362" width="200px">Tab3</t:panelTab>
    <t:panelBody src="childForm.jsp">
    </t:panelBody>
</t:panel>

CHILD FORM CODE:

<FORM METHOD="GET" NAME="childForm"  id = "childForm" ACTION=<%=response.encodeURL("processChildForm.jsp")%>>
<span style="padding:0 10px;">
<button class="submitChildFormClass"
        style="width:auto;"
        id="submitChildForm"
        >Process Child Form
</button>
    </span>
</FORM>

I wanted to submit the child form when i click on submitChildForm button so I wrote the below jquery handler to do that:

$('.submitChildFormClass').live('click',function() {
    document.getElementById("previewOnlyVal").value = "previewOnly";
    $('#childForm').submit();
});

The problem is that when I click on the button, the MAIN FORM gets submitted instead of the child form. I know it isn't a good programming practice to use nested forms but this is an old code and we do not have much time yet to revise these codes.
Can anyone tell me what I might be missing in the codes which causes the main form to be submitted by the jquery? Thanks in advance for your help.

分享到QQ

分享到微博