Search code examples
javascriptformskenticoparsley.js

Validate two forms inside one form element with ParsleyJS


I'm building two forms which will live on a single page on a Kentico website. kentico websites are wrapped in one single form field so I can't create individual form elements for each form on the page. The problem is parsleyJS will only allow you to pass a form to initialise it e.g. $("#form").parsley(); and I need to validate the forms independent of each other. Has anyone had this issue before? Can anyone recommend a workaround.

$("#form").parsley();
input{
	display:block;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/parsley.js/2.8.1/parsley.min.js"></script>
<form action="" id="form">
	<div class="form1">
		<label for="fname">First Name</label>
		<input type="text" name="fname" required>
		<label for="lname">Last Name</label>
		<input type="text" name="lname" required>
		<input type="submit" value="submit">
	</div>
	<div class="form2">
		<input type="text" name="anotherInput" required>
		<input type="submit" value="submit">
	</div>
</form>


Solution

  • You may be able to get the results you want using the group option to validate only part of the fields in your form. This is used in this example of a multi step form.