D7net
Home
Console
Upload
information
Create File
Create Folder
About
Tools
:
/
home5
/
rakcha
/
public_html
/
control
/
assets
/
js
/
pages
/
validation
/
Filename :
form-validation.js
back
Copy
/** * Document : form-validation.js * Author : redstar * Description: Script related to validate the form * **/ var FormValidation = function () { // basic validation var handleValidation1 = function() { // for more info visit the official plugin documentation: // http://docs.jquery.com/Plugins/Validation var form1 = $('#form_sample_1'); form1.validate({ errorElement: 'span', //default input error message container errorClass: 'help-block help-block-error', // default input error message class focusInvalid: false, // do not focus the last invalid input ignore: "", // validate all fields including form hidden input messages: { select_multi: { maxlength: jQuery.validator.format("Max {0} items allowed for selection"), minlength: jQuery.validator.format("At least {0} items must be selected") } }, rules: { name: { minlength: 2, required: true }, email: { required: true, email: true }, url: { required: true, url: true }, number: { required: true, number: true }, digits: { required: true, digits: true }, creditcard: { required: true, creditcard: true }, occupation: { minlength: 5, }, select: { required: true }, }, invalidHandler: function (event, validator) { //display error alert on form submit success1.hide(); error1.show(); App.scrollTo(error1, -200); }, errorPlacement: function (error, element) { // render error placement for each input type var cont = $(element).parent('.input-group'); if (cont) { cont.after(error); } else { element.after(error); } }, highlight: function (element) { // hightlight error inputs $(element).closest('.form-group').removeClass('has-success').addClass('has-error'); // set error class to the control group }, unhighlight: function (element) { // revert the change done by hightlight $(element).closest('.form-group').removeClass('has-error').addClass('has-success'); // set error class to the control group }, success: function (label) { label.closest('.form-group').removeClass('has-error').addClass('has-success'); // set success class to the control group }, submitHandler: function (form) { success1.show(); error1.hide(); } }); } // validation using icons var handleValidation2 = function() { // for more info visit the official plugin documentation: // http://docs.jquery.com/Plugins/Validation var form2 = $('#form_sample_2'); var error2 = $('.alert-danger', form2); var success2 = $('.alert-success', form2); form2.validate({ errorElement: 'span', //default input error message container errorClass: 'help-block help-block-error', // default input error message class focusInvalid: false, // do not focus the last invalid input ignore: "", // validate all fields including form hidden input rules: { name: { minlength: 2, required: true }, email: { required: true, email: true }, email: { required: true, email: true }, url: { required: true, url: true }, number: { required: true, number: true }, creditcard: { required: true, creditcard: true }, }, invalidHandler: function (event, validator) { //display error alert on form submit success2.hide(); error2.show(); App.scrollTo(error2, -200); }, errorPlacement: function (error, element) { // render error placement for each input type var icon = $(element).parent('.input-icon').children('i'); icon.removeClass('fa-check').addClass("fa-warning"); icon.attr("data-original-title", error.text()).tooltip({'container': 'body'}); }, highlight: function (element) { // hightlight error inputs $(element) .closest('.form-group').removeClass("has-success").addClass('has-error'); // set error class to the control group }, unhighlight: function (element) { // revert the change done by hightlight }, success: function (label, element) { var icon = $(element).parent('.input-icon').children('i'); $(element).closest('.form-group').removeClass('has-error').addClass('has-success'); // set success class to the control group icon.removeClass("fa-warning").addClass("fa-check"); }, submitHandler: function (form) { success2.show(); error2.hide(); form[0].submit(); // submit the form } }); } return { //main function to initiate the module init: function () { handleValidation1(); handleValidation2(); } }; }(); jQuery(document).ready(function() { 'use strict'; FormValidation.init(); });