Is it possible to validate two forms on a page?

[rick.emmet]

Hi Everyone,

I would like to use JQuery to validate my forms. This works well enough if I have a single form on a page, unfortunately, I need to have several forms on one page and have found that the validation quits after the first form. Here's the code:

 

<!-- HTML CODE -->

<!-- display first form -->
<div class="formLayout">
<form method="" action="tfc_member.php" id="form1" >
<h4>Login Form</h4>
<label>Username:</label>
<input type="text" name="username" class="required"/><br />
<label>Password:</label>
<input type="password" name="passwd" class="required" /><br /><br />
<label></label><input type="submit" value="Log in"/><br /><br />
</form>

<!-- display second form -->
<form method="" action="" id="form2" >
<h4>Some Other Form</h4>
<label>Account Number:</label>
<input type="text" name="username" class="required"/><br />
<label>Operating District:</label>
<input type="test" name="opDist" class="required" /><br /><br />
<label></label><input type="submit" value="Include This Too"/><br /><br />
</form>
</div>

 

A couple of things – I switched the order of the forms so that “form2” would be validated first and there was no change in behavior. I tried giving both forms “id=form” and I still get the same behavior.

 

Here's the Jquery code:

 

<script>
$(document).ready(function() {
$("#form1, #form2").validate();
  }
);
</script>

 

And I also tried:

 

<script>
$(document).ready(function() {
$("#form").validate();
  }
);
</script>

 

Where both forms had “id=form”. In every case only the first form is validated. I also attempted to apply the validation function on a div “id=form” and wrapped the it around both the forms – there was no validation at all. Does anyone know of a way to get the second form to be validated? Thanks in advance for your help!

Cheers,

Rick

[rick.emmet]

Hello Everyone,

OK, this is a little weird - and I have a bit of egg on my face! I had tried one other approach (not mentioned above); writing two functions, where one validates "form1" and the other validates "form2". When I previously went into the second form and removed data that had been there (the actual form allows one to edit data that has been entered in a previous form and the above example is a simpler version), the validation error messages didn't appear. What I failed to try, was to submit the edited form. I just tried this and when the submit button is clicked on, viola, the error messages appear! Sorry about the false alarm, the code which works is as follows:

 

<script>
$(document).ready(function() {
$("#form1").validate();
  }
);

$(document).ready(function() {
$("#form2").validate();
  }
);

</script>

 

Hope this is of help to you all - thanks to all of you that took the time to view the post.

Cheers,

Rick