Validation based in Parsley plugin. For more info and view the documentation, go to: Parsley Doc
<form id="form-validation-test1">
<div class="row">
<div class="col-md-12">
<div class="eq-ui-form-group eq-ui-input-field">
<input id="username-test1" type="text" data-parsley-minlength="6" class="form-control eq-ui-input" required>
<label for="username-test1" data-error="Min length 6">Username</label>
</div>
</div>
</div>
<div class="row">
<div class="col-md-6">
<div class="row">
<div class="col-md-12">
<div class="eq-ui-form-group eq-ui-input-field">
<input id="first_name-test1" type="text" data-parsley-minlength="3" class="form-control eq-ui-input">
<label for="first_name-test1" data-error="Min length 3">First Name</label>
</div>
</div>
</div>
</div>
<div class="col-md-6">
<div class="row">
<div class="col-md-12">
<div class="eq-ui-form-group eq-ui-input-field">
<input id="last_name-test1" type="text" data-parsley-minlength="3" class="form-control eq-ui-input">
<label for="last_name-test1" data-error="Min length 3">Last Name</label>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-6">
<div class="row">
<div class="col-md-12">
<div class="eq-ui-form-group eq-ui-input-field">
<input id="password-test1" type="password" data-parsley-minlength="6" class="form-control eq-ui-input" required>
<label for="password-test1" data-error="Min length 6">Password</label>
</div>
</div>
</div>
</div>
<div class="col-md-6">
<div class="row">
<div class="col-md-12">
<div class="eq-ui-form-group eq-ui-input-field">
<input id="password-confirm-test1" type="password" data-parsley-minlength="6" data-parsley-equalto="#password-test1" class="form-control eq-ui-input" required>
<label for="password-confirm-test1" data-error="Min length 6 or Password not equal">Confirm Password</label>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-6">
<div class="row">
<div class="col-md-12">
<div class="eq-ui-form-group eq-ui-input-field">
<input id="email-test1" type="email" class="form-control eq-ui-input" required>
<label for="email-test1" data-error="Email not valid">Email</label>
</div>
</div>
</div>
</div>
<div class="col-md-6">
<div class="row">
<div class="col-md-12">
<div class="eq-ui-form-group eq-ui-input-field">
<select id="gender-test1" class="eq-ui-select" required>
<option value="" disabled selected>Choose your gender</option>
<option value="1">Male</option>
<option value="2">Female</option>
</select>
<label data-error="Required">Gender</label>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-6">
<div class="row">
<div class="col-md-12">
<div class="eq-ui-form-group eq-ui-input-field">
<input id="city-test1" type="text" class="form-control eq-ui-input" required>
<label for="city-test1" data-error="Required">City</label>
</div>
</div>
</div>
</div>
<div class="col-md-6">
<div class="row">
<div class="col-md-12">
<div class="eq-ui-form-group eq-ui-input-field">
<input id="country-test1" type="text" class="form-control eq-ui-input" required>
<label for="country-test1" data-error="Required">Country</label>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="eq-ui-form-group eq-ui-input-field">
<input type="checkbox" id="agree-test1" data-parsley-class-handler="#agree-test1" class="eq-ui-input filled-in" required/>
<label for="agree-test1">I agree to the terms and conditions</label>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="eq-ui-form-group eq-ui-input-field">
<a id="form-validation-test1-submit" class="btn btn-primary eq-ui-waves-light">Submit</a>
</div>
</div>
</div>
</form>Sample usage with submit
$(document).ready(function(){
// Validate form (Test 1)
EqUI.forms.add_form_for_submit_validate($('#form-validation-test1'));
$('#form-validation-test1-submit').on('click', function(e) {
$('#form-validation-test1').submit();
});
});Programmatically validations for the form and individual fiels
$(document).ready(function(){
// Validate form (Return boolean)
$('#form-validation-test1-submit').on('click', function(e) {
var result = EqUI.forms.validate_form($('#form-validation-test1'));
console.log(result);
});
// Validate field (Return boolean)
$('#form-validation-test1-submit').on('click', function(e) {
var result = EqUI.forms.validate_field($('#username-test1'));
console.log(result);
});
});For using other validation plugins, set this option in custom mode
$(document).ready(function(){
EqUI.forms.validateLib = 'custom'; // parsley | custom
});