是否可以像这样嵌套html表单

<form name="mainForm">
  <form name="subForm">
  </form>
</form>

两种形式都适用吗?我的朋友有这个问题,subForm的一部分工作,而另一部分不工作。


当前回答

普通html不允许您这样做。但javascript可以做到。 如果你正在使用javascript/jquery,你可以用一个类来分类你的表单元素,然后使用serialize()来序列化那些你想要提交的项目子集的表单元素。

<form id="formid">
    <input type="text" class="class1" />
    <input type="text" class="class2">
</form>

然后在你的javascript中,你可以这样做来序列化class1元素

$(".class1").serialize();

对于class2你可以这样做

$(".class2").serialize();

对于整个形式

$("#formid").serialize();

或者简单地

$("#formid").submit();

其他回答

今天,我也遇到了同样的问题,为了解决这个问题我增加了一个用户控件和 在这个控件上,我使用这个代码

<div class="divformTagEx">

</div>

<asp:Literal runat="server" ID="litFormTag" Visible="false">
'<div> <form  style="margin-bottom: 3;" action="http://login.php" method="post" name="testformtag"></form> </div>'</asp:Literal>

并在页面的PreRenderComplete事件中调用此方法

private void InitializeJavaScript()
{
        var script = new StringBuilder();
        script.Append("$(document).ready(function () {");
        script.Append("$('.divformTagEx').append( ");
        script.Append(litFormTag.Text);
        script.Append(" )");
        script.Append(" });");
        ScriptManager.RegisterStartupScript(this, GetType(), "nestedFormTagEx", script.ToString(), true);
    }

我相信这会有帮助。

虽然我没有给出嵌套表单的解决方案(它不可靠地工作),但我确实提出了一个适合我的解决方案:

使用场景:允许一次更改N个项的超表单。它底部有一个“提交全部”按钮。每个项目都有自己的嵌套表单,带有“提交项目# N”按钮。但是不能…

在这种情况下,实际上可以使用单个表单,然后将按钮的名称设为submit_1..submit_N和submitAll并在服务器端处理它,如果按钮的名称是submit_1,则只查看以_1结尾的参数。

<form>
    <div id="item1">
        <input type="text" name="foo_1" value="23">
        <input type="submit" name="submit_1" value="Submit Item #1">
    </div>
    <div id="item2">
        <input type="text" name="foo_2" value="33">
        <input type="submit" name="submit_2" value="Submit Item #2">
    </div>
    <input type="submit" name="submitAll" value="Submit All Items">
</form>

好吧,这算不上什么发明,但确实管用。

HTML5 <input>表单属性可以是解决方案。 从http://www.w3schools.com/tags/att_input_form.asp:

表单属性是HTML5中的新属性。 指定<input>元素属于哪个<form>元素。此属性的值必须是同一文档中<form>元素的id属性。

场景:

input_Form1_n1 input_Form2_n1 input_Form1_n2 input_Form2_n2

实现:

<form id="Form1" action="Action1.php" method="post"></form>
<form id="Form2" action="Action2.php" method="post"></form>

<input type="text" name="input_Form1_n1" form="Form1" />
<input type="text" name="input_Form2_n1" form="Form2" />
<input type="text" name="input_Form1_n2" form="Form1" />
<input type="text" name="input_Form2_n2" form="Form2" />

<input type="submit" name="button1" value="buttonVal1" form="Form1" />
<input type="submit" name="button2" value="buttonVal2" form="Form2" />

在这里你可以找到浏览器的兼容性。

虽然这个问题已经很老了,而且我同意@everyone的观点,HTML中不允许嵌套表单

但这个东西大家可能都想看看

在那里你可以hack(我称之为黑客,因为我确定这不是合法的)html允许浏览器有嵌套的形式

<form id="form_one" action="http://apple.com">
  <div>
    <div>
        <form id="form_two" action="/">
            <!-- DUMMY FORM TO ALLOW BROWSER TO ACCEPT NESTED FORM -->
      </form>
    </div>
      <br/>
    <div>
      <form id="form_three" action="http://www.linuxtopia.org/">
          <input type='submit' value='LINUX TOPIA'/>
      </form>
    </div>
      <br/>

    <div>
      <form id="form_four" action="http://bing.com">
          <input type='submit' value='BING'/>
      </form>
    </div>
      <br/>  
    <input type='submit' value='Apple'/>
  </div>  
</form>

Js小提琴link

http://jsfiddle.net/nzkEw/10/

关于嵌套表单:我花了10年的时间调试一个ajax脚本。

对不起,我之前的回答/例子没有说明HTML标记。

<form id='form_1' et al>
  <input stuff>
  <submit onClick='ajaxFunction(That_Puts_form_2_In_The_ajaxContainer)'>
  <td id='ajaxContainer'></td>
</form>

Form_2不断失败,表示无效的Form_2。

当我把产生form_2 < I >的ajaxContainer移到form_1的</ I >外时,我又回到了业务中。它回答了为什么会嵌套形式的问题。我的意思是,如果不定义要使用哪种表单,ID是什么?肯定有更好、更圆滑的办法。