在同一页面上验证多个表单

Question

例如,我在页面中有3个具有相同名称的表单.如何使用一种验证方法验证所有这些表单？

<form id="formID">
<input name="nick">
<input type="submit">
</form>

<form id="formID">
<input name="nick">
<input type="submit">
</form>

<form id="formID">
<input name="nick">
<input type="submit">
</form>

我想要同时验证所提交的表单不是全部.

$('#formID').validate({
})

我的解决方案不起作用.我还发现我无法添加不同的ID,因为这些表单在PHP循环中,并且必须具有相同的ID.

Answer 1

当您需要将相同的.validate()方法应用于多个表单时,您只需要一个jQuery.each(),您可以通过form标记一次性地将它们全部定位.

$('form').each(function() {   // <- selects every <form> on page
    $(this).validate({        // <- initialize validate() on each form
        // your options       // <- set your options inside
    });
});

演示:http: //jsfiddle.net/K6Tkn/

引用OP:

"我还发现我无法添加不同的ID,因为这些表单位于PHP循环中,并且必须具有相同的ID."

然后你的PHP循环没有正确构建. 页面上的每个id页面都必须是唯一的,否则HTML标记无效.你可以简单地使用class而不是id.否则,如果<form>页面上没有其他元素,您可以将它们全部定位,$('form')如上面的演示所示.

Answer 2

我已经为你创造了小提琴。如果您确实需要它们，请添加 ID。

关键是向表单添加相同的类并验证每个表单。

$('form.validateForm').each(function(key, form) {
    $(form).validate(); 
});

Answer 3

这是在单个页面上验证多个表单的解决方案：

<script src="//code.jquery.com/jquery-1.12.0.min.js"></script>

<script type="text/javascript">
  $(document).ready(function () {
    $("form").submit(function () {

      var clikedForm = $(this); // Select Form

      if (clikedForm.find("[name='mobile_no']").val() == '') {
        alert('Enter Valid mobile number');
        return false;
      }
      if (clikedForm.find("[name='email_id']").val() == '') {
        alert('Enter  valid email id');
        return false;
      }

    });
  });
</script>

它对我有用。我在一个页面中为 5 个表单编写了这段代码。