form-submit - 提交按钮提交错误的表单

Question

我在同一个页面上有两个表单，如下所示:

<section class="login_column box" >

    <h3>For patients:</h3>

    <form id="patients_form" name="patients_form" action="<?php echo $_SERVER['REQUEST_URI'] ?>" method="POST">

    <fieldset>

        <p><label for="patient_login">Email:</label><input type="text" id="patient_login" name="patient_login" placeholder="Email" value="" required></p>

        <p><label for="patient_password">Password:</label><input type="password" id="patient_password" name="patient_password" placeholder="Password" value="" required></p>

        <p><label></label><button id="patients" style="margin-top:17px;" name="patients" type="submit">&nbsp;&nbsp;&nbsp;Login&nbsp;&nbsp;&nbsp;</button></p>

    </fieldset>

    </form>

</section>


<section class="login_column box">

    <h3>For physicians:</h3>

    <form id="physicians_form" name="physicians_form" action="<?php echo $_SERVER['REQUEST_URI'] ?>" method="POST">

    <fieldset>

        <p><label for="physician_login">Email:</label><input type="text" id="physician_login" name="physician_login" placeholder="Email" value="" required></p>

        <p><label for="physician_password">Password:</label><input type="password" id="physician_password" name="physician_password" placeholder="Password" value="" required></p>

        <p><label></label><button id="physicians" name="physicians" style="margin-top:17px;" value="Login" type="submit">&nbsp;&nbsp;&nbsp;Вход&nbsp;&nbsp;&nbsp;</button></p>

    </fieldset>

    </form>

</section>

当某些提交按钮被按下时，第一个表单被提交，即使第二个提交按钮可能被按下。如何保证每个提交按钮只提交自己的表单？

Answer 1

通常，一个无类型的 button ，或 input与 type="button/submit"默认情况下，将提交所有祖先 form (s).如果您缺少结尾 </form> ，浏览器可能会对它何时结束感到困惑。你写的方式看起来应该可以正常工作，但是......

让我头疼的一件事是在我的 CMS 上使用单一表单 .NET 设置，它将整个页面包装在一个大表单中。 CMS 随后剥离任何 <form>我可以手动输入的标签，以及任何 button/input单击将提交页面表单。也许您有类似的 CMS 问题？

编辑:

所以看看你的代码......正确的形式似乎是提交:

$('#physicians_form').on('submit',function(){ console.log('physicians'); });
$('#patients_form').on('submit',function(){ console.log('patients'); });

他们正确记录。正确的表格正在提交，但您的 validate.js 似乎是只验证第一个表单，无论提交哪个表单...我不熟悉 validate.js插件，但是否有一种方法可以指定哪个按钮应该验证哪个表单？