diff --git a/examples/index.html b/examples/index.html index cbdac86..e342624 100644 --- a/examples/index.html +++ b/examples/index.html @@ -27,6 +27,9 @@ realTime : true }); $('#exm2').validetta({ + display : 'inline', + errorClass : 'validetta-inline', + errorClose : false, ajax : { call : true, type : 'POST', diff --git a/validetta-min.js b/validetta-min.js index 7832ebc..95cc09b 100644 --- a/validetta-min.js +++ b/validetta-min.js @@ -1,5 +1,5 @@ /*! * Validetta - Client-side form validation jQuery plugin - * Version: 0.8.0 (13 December 2013) | Copyright 2013 Hasan Aydoğdu - http://www.hasanaydogdu.com + * Version: 0.9.0 (16 February 2014) | Copyright 2013 Hasan Aydoğdu - http://www.hasanaydogdu.com */ -(function(f){var h={},a={},d=new RegExp(/(minChecked|maxChecked|minSelected|maxSelected|minLength|maxLength|equal|customReg)\[[(\w)-_]{1,15}\]/i),c=new RegExp(/^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)*$/),b=new RegExp(/^[\-\+]?\d+\.?\d*$/);var e={empty:"This field is required. Please be sure to check.",email:"Your E-mail address appears to be invalid. Please be sure to check.",number:"You can enter only numbers in this field.",maxLength:"Maximum {count} characters allowed!",minLength:"Minimum {count} characters allowed!",checkbox:"This checkbox is required. Please be sure to check.",maxChecked:"Maximum {count} options allowed. Please be sure to check.",minChecked:"Please select minimum {count} options.",selectbox:"Please select an option.",maxSelected:"Maximum {count} selection allowed. Please be sure to check.",minSelected:"Minimum {count} selection allowed. Please be sure to check.",notEqual:"Fields do not match. Please be sure to check.",creditCard:"Invalid credit card number. Please be sure to check."};var g={errorClass:"validetta-error",errorCloseClass:"validetta-errorClose",ajax:{call:false,type:"GET",url:null,dataType:"html",beforeSend:f.noop,success:f.noop,fail:f.noop,complete:f.noop},realTime:false,onCompleteFunc:f.noop,customReg:{}};h=function(j,i){this.handler=false;this.options=f.extend(true,{},g,i);this.form=j;return this.events.call(this)};h.prototype.events=function(){var i=this;f(this.form).submit(function(j){a=this.querySelectorAll("[data-validetta]");return i.init.call(i,j)});if(this.options.realTime===true){f(this.form).find("[data-validetta]").not("[type=checkbox]").on("change",function(j){a=f(this);return i.init.call(i,j)});f(this.form).find("[data-validetta][type=checkbox]").on("click",function(j){a=i.form.querySelectorAll('[data-validetta][type=checkbox][name="'+this.name+'"]');return i.init.call(i,j)})}f(this.form).find("[type=reset]").on("click",function(){return i.reset.call(i)});f(this.form).on("click","."+this.options.errorCloseClass,function(){var j=this.parentNode;if(j){i.window.close.call(i,j)}return false})};h.prototype.init=function(r){var q=this;this.reset.call(this,a);for(var p=a.length-1;p>=0;p--){var s,m,o=[],l=[];s=a[p];m="";o=f(s).val();l=s.getAttribute("data-validetta").split(",");for(var n=l.length-1;n>=0;n--){if(l[n]==="required"){var k=s.getAttribute("type");if(k==="checkbox"&&!q.check.checkbox.checked(s)){m+=e.checkbox+"
"}else{if(k==="radio"&&q.check.radio.call(q,s)){m+=e.empty+"
"}else{if(s.tagName==="SELECT"&&!q.check.selectbox.selected(o)){m+=e.selectbox+"
"}}}if((k==="text"||k==="password"||s.tagName==="TEXTAREA")&&!q.check.empty.call(q,o)){m+=e.empty+"
"}}if(l[n]==="number"&&!q.check.number(o)){m+=e.number+"
"}if(l[n]==="email"&&!q.check.mail(o)){m+=e.email+"
"}if(l[n]==="creditCard"&&o!==""&&!q.check.creditCard(o)){m+=e.creditCard+"
"}if(d.test(l[n])){var t=l[n].split(/\[|,|\]/);if(t[0]==="maxLength"&&!q.check.maxLength(o,t[1])){m+=e.maxLength.replace("{count}",t[1])+"
"}else{if(t[0]==="minLength"&&!q.check.minLength(o,t[1])){m+=e.minLength.replace("{count}",t[1])+"
"}else{if(t[0]==="maxChecked"&&!q.check.checkbox.maxChecked.call(q,s,t[1])){s=q.form.querySelectorAll('input[type=checkbox][data-validetta][name="'+s.name+'"]')[0];m+=e.maxChecked.replace("{count}",t[1])+"
"}else{if(t[0]==="minChecked"&&!q.check.checkbox.minChecked.call(q,s,t[1])){s=q.form.querySelectorAll('input[type=checkbox][data-validetta][name="'+s.name+'"]')[0];m+=e.minChecked.replace("{count}",t[1])+"
"}else{if(t[0]==="maxSelected"&&!q.check.selectbox.maxSelected(o,t[1])){m+=e.maxSelected.replace("{count}",t[1])+"
"}else{if(t[0]==="minSelected"&&!q.check.selectbox.minSelected(o,t[1])){m+=e.minSelected.replace("{count}",t[1])+"
"}else{if(t[0]==="equal"&&!q.check.equal.call(q,o,t[1])){m+=e.notEqual+"
"}else{if(t[0]==="customReg"&&!q.check.customReg(o,q.options.customReg[t[1]].method)){m+=(q.options.customReg[t[1]].errorMessage||e.empty)+"
"}}}}}}}}}}if(m!==""){q.window.open.call(q,s,m)}}if(r.type!=="submit"){return}else{if(q.handler===true){return false}else{if(q.options.ajax.call){q.ajax.call(q,arguments);return false}return q.options.onCompleteFunc(q,r)}}};h.prototype.check={empty:function(i){return(this.clear(i)==="")?false:true},mail:function(i){return((c.test(i)===false)&&i!=="")?false:true},number:function(i){return((b.test(i)===false)&&i!=="")?false:true},minLength:function(j,i){var k=j.length;return(ki)?false:true},equal:function(j,i){return(f(this.form).find('input[name="'+i+'"]').val()!==j)?false:true},creditCard:function(k){var j,r,o,p,l,n,m=0,q;j=new RegExp(/[^0-9]+/g);r=k.replace(j,"");q=r.length;if(q<16){return false}for(l=0;l9){n=1+(n-10)}}else{n=p}m+=n}if(m>0&&m%10===0){return true}return false},checkbox:{checked:function(i){return(!i.checked)?false:true},maxChecked:function(k,i){var j=f(this.form.querySelectorAll('input[type=checkbox][name="'+k.name+'"]')).filter(":checked").length;return(j>i)?false:true},minChecked:function(k,i){var j=f(this.form.querySelectorAll('input[type=checkbox][name="'+k.name+'"]')).filter(":checked").length;return(ji)?false:true},minSelected:function(j,i){return(j!==null&&j!==""&&j.length0){return}var o,j,p,l,i,k;o=f(q).position();j=f(q).width();p=f(q).height();l=o.top;i=document.createElement("span");i.className=this.options.errorClass;k=document.createElement("span");k.innerHTML="x";k.className=this.options.errorCloseClass;f(i).empty().css({left:o.left+j+30+"px",top:l+"px"});m.appendChild(i);i.innerHTML=n;i.appendChild(k);this.handler=true},close:function(i){i.parentNode.removeChild(i);this.handler=false}};h.prototype.reset=function(k){var l={};if(typeof k==="undefined"||(k.length>1&&k[0].getAttribute("type")!=="checkbox")){l=f(this.form).find("."+this.options.errorClass)}else{l=f(k[0].parentNode).find("."+this.options.errorClass)}for(var j=l.length-1;j>=0;j--){this.window.close.call(this,l[j])}};h.prototype.clear=function(i){return i.replace(/^\s+|\s+$/g,"")};h.prototype.ajax=function(){var l,j,k=this,i;l=f(this.form).serialize();i=this.form.getAttribute("action");j=(this.options.ajax.url)?this.options.ajax.url:i;if(!this.options.ajax.url&&(i===""||i===null)){return console.log("Form action not valid !")}f.ajax({type:k.options.ajax.type,url:j,data:l,dataType:k.options.ajax.dataType,options:k.options,beforeSend:function(){return k.options.ajax.beforeSend()}}).done(function(m){k.options.ajax.success(k,m)}).fail(function(m,n){k.options.ajax.fail(m,n)}).always(function(m){k.options.ajax.complete(m)})};f.fn.validetta=function(i){if(f.validettaLanguage){e=f.extend(true,{},e,f.validettaLanguage.messages)}return this.each(function(){new h(this,i);return this})}})(jQuery); \ No newline at end of file +(function(f){var h={},a={},d=new RegExp(/(minChecked|maxChecked|minSelected|maxSelected|minLength|maxLength|equal|customReg)\[[(\w)-_]{1,15}\]/i),c=new RegExp(/^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)*$/),b=new RegExp(/^[\-\+]?\d+\.?\d*$/);var e={empty:"This field is required. Please be sure to check.",email:"Your E-mail address appears to be invalid. Please be sure to check.",number:"You can enter only numbers in this field.",maxLength:"Maximum {count} characters allowed!",minLength:"Minimum {count} characters allowed!",checkbox:"This checkbox is required. Please be sure to check.",maxChecked:"Maximum {count} options allowed. Please be sure to check.",minChecked:"Please select minimum {count} options.",selectbox:"Please select an option.",maxSelected:"Maximum {count} selection allowed. Please be sure to check.",minSelected:"Minimum {count} selection allowed. Please be sure to check.",notEqual:"Fields do not match. Please be sure to check.",creditCard:"Invalid credit card number. Please be sure to check."};var g={display:"bubble",errorClass:"validetta-bubble",errorClose:true,errorCloseClass:"validetta-bubbleClose",ajax:{call:false,type:"GET",url:null,dataType:"html",beforeSend:f.noop,success:f.noop,fail:f.noop,complete:f.noop},realTime:false,onCompleteFunc:f.noop,customReg:{}};h=function(j,i){this.handler=false;this.options=f.extend(true,{},g,i);this.form=j;return this.events.call(this)};h.prototype.events=function(){var i=this;f(this.form).submit(function(j){a=this.querySelectorAll("[data-validetta]");return i.init.call(i,j)});if(this.options.realTime===true){f(this.form).find("[data-validetta]").not("[type=checkbox]").on("change",function(j){a=f(this);return i.init.call(i,j)});f(this.form).find("[data-validetta][type=checkbox]").on("click",function(j){a=i.form.querySelectorAll('[data-validetta][type=checkbox][name="'+this.name+'"]');return i.init.call(i,j)})}f(this.form).find("[type=reset]").on("click",function(){return i.reset.call(i)});if(this.options.errorClose){f(this.form).on("click","."+this.options.errorCloseClass,function(){var j=this.parentNode;if(j){i.window.close.call(i,j)}return false})}};h.prototype.init=function(r){var q=this;this.reset.call(this,a);for(var p=a.length-1;p>=0;p--){var s,m,o=[],l=[];s=a[p];m="";o=f(s).val();l=s.getAttribute("data-validetta").split(",");for(var n=l.length-1;n>=0;n--){if(l[n]==="required"){var k=s.getAttribute("type");if(k==="checkbox"&&!q.check.checkbox.checked(s)){m+=e.checkbox+"
"}else{if(k==="radio"&&q.check.radio.call(q,s)){m+=e.empty+"
"}else{if(s.tagName==="SELECT"&&!q.check.selectbox.selected(o)){m+=e.selectbox+"
"}}}if((k==="text"||k==="password"||s.tagName==="TEXTAREA")&&!q.check.empty.call(q,o)){m+=e.empty+"
"}}if(l[n]==="number"&&!q.check.number(o)){m+=e.number+"
"}if(l[n]==="email"&&!q.check.mail(o)){m+=e.email+"
"}if(l[n]==="creditCard"&&o!==""&&!q.check.creditCard(o)){m+=e.creditCard+"
"}if(d.test(l[n])){var t=l[n].split(/\[|,|\]/);if(t[0]==="maxLength"&&!q.check.maxLength(o,t[1])){m+=e.maxLength.replace("{count}",t[1])+"
"}else{if(t[0]==="minLength"&&!q.check.minLength(o,t[1])){m+=e.minLength.replace("{count}",t[1])+"
"}else{if(t[0]==="maxChecked"&&!q.check.checkbox.maxChecked.call(q,s,t[1])){s=q.form.querySelectorAll('input[type=checkbox][data-validetta][name="'+s.name+'"]')[0];m+=e.maxChecked.replace("{count}",t[1])+"
"}else{if(t[0]==="minChecked"&&!q.check.checkbox.minChecked.call(q,s,t[1])){s=q.form.querySelectorAll('input[type=checkbox][data-validetta][name="'+s.name+'"]')[0];m+=e.minChecked.replace("{count}",t[1])+"
"}else{if(t[0]==="maxSelected"&&!q.check.selectbox.maxSelected(o,t[1])){m+=e.maxSelected.replace("{count}",t[1])+"
"}else{if(t[0]==="minSelected"&&!q.check.selectbox.minSelected(o,t[1])){m+=e.minSelected.replace("{count}",t[1])+"
"}else{if(t[0]==="equal"&&!q.check.equal.call(q,o,t[1])){m+=e.notEqual+"
"}else{if(t[0]==="customReg"&&!q.check.customReg(o,q.options.customReg[t[1]].method)){m+=(q.options.customReg[t[1]].errorMessage||e.empty)+"
"}}}}}}}}}}if(m!==""){q.window.open.call(q,s,m)}}if(r.type!=="submit"){return}else{if(q.handler===true){return false}else{if(q.options.ajax.call){q.ajax.call(q,arguments);return false}return q.options.onCompleteFunc(q,r)}}};h.prototype.check={empty:function(i){return(this.clear(i)==="")?false:true},mail:function(i){return((c.test(i)===false)&&i!=="")?false:true},number:function(i){return((b.test(i)===false)&&i!=="")?false:true},minLength:function(j,i){var k=j.length;return(ki)?false:true},equal:function(j,i){return(f(this.form).find('input[name="'+i+'"]').val()!==j)?false:true},creditCard:function(k){var j,r,o,p,l,n,m=0,q;j=new RegExp(/[^0-9]+/g);r=k.replace(j,"");q=r.length;if(q<16){return false}for(l=0;l9){n=1+(n-10)}}else{n=p}m+=n}if(m>0&&m%10===0){return true}return false},checkbox:{checked:function(i){return(!i.checked)?false:true},maxChecked:function(k,i){var j=f(this.form.querySelectorAll('input[type=checkbox][name="'+k.name+'"]')).filter(":checked").length;return(j>i)?false:true},minChecked:function(k,i){var j=f(this.form.querySelectorAll('input[type=checkbox][name="'+k.name+'"]')).filter(":checked").length;return(ji)?false:true},minSelected:function(j,i){return(j!==null&&j!==""&&j.length0){return}var i=document.createElement("span");i.className=this.options.errorClass;if(this.options.display==="bubble"){var o,j,p,l;o=f(q).position();j=f(q).width();p=f(q).height();l=o.top;f(i).empty().css({left:o.left+j+30+"px",top:l+"px"})}m.appendChild(i);i.innerHTML=n;if(this.options.errorClose){var k=document.createElement("span");k.innerHTML="x";k.className=this.options.errorCloseClass;i.appendChild(k)}this.handler=true},close:function(i){i.parentNode.removeChild(i);this.handler=false}};h.prototype.reset=function(k){var l={};if(typeof k==="undefined"||(k.length>1&&k[0].getAttribute("type")!=="checkbox")){l=f(this.form).find("."+this.options.errorClass)}else{l=f(k[0].parentNode).find("."+this.options.errorClass)}for(var j=l.length-1;j>=0;j--){this.window.close.call(this,l[j])}};h.prototype.clear=function(i){return i.replace(/^\s+|\s+$/g,"")};h.prototype.ajax=function(){var l,j,k=this,i;l=f(this.form).serialize();i=this.form.getAttribute("action");j=(this.options.ajax.url)?this.options.ajax.url:i;if(!this.options.ajax.url&&(i===""||i===null)){return console.log("Form action not valid !")}f.ajax({type:k.options.ajax.type,url:j,data:l,dataType:k.options.ajax.dataType,options:k.options,beforeSend:function(){return k.options.ajax.beforeSend()}}).done(function(m){k.options.ajax.success(k,m)}).fail(function(m,n){k.options.ajax.fail(m,n)}).always(function(m){k.options.ajax.complete(m)})};f.fn.validetta=function(i){if(f.validettaLanguage){e=f.extend(true,{},e,f.validettaLanguage.messages)}return this.each(function(){new h(this,i);return this})}})(jQuery); \ No newline at end of file diff --git a/validetta.css b/validetta.css index a6c34a9..acaf06c 100644 --- a/validetta.css +++ b/validetta.css @@ -1,3 +1,5 @@ -.validetta-error{display:block; font:12px/14px Arial, Helvetica, sans-serif; position:absolute; background-color:#CD2E26; max-width:325px; border-radius:5px; color:white; padding:5px 12px;} -.validetta-error:before{content:''; display:block; position:absolute; top:7px; left:-5px; width:0px; height:0px; border-right:5px solid #CD2E26; border-bottom: 5px solid transparent; border-top:5px solid transparent; } -.validetta-errorClose{display:block; cursor:pointer; position:absolute; top:-1px; right:3px; color:white; font-weight:bold;} +.validetta-bubble { position:absolute; background-color:#CD2E26; max-width:325px; border-radius:5px; color:white; padding:5px 12px; } +.validetta-bubble:before { content:''; display:block; position:absolute; top:7px; left:-5px; width:0; height:0; border-right:5px solid #CD2E26; border-bottom: 5px solid transparent; border-top:5px solid transparent; } +.validetta-bubbleClose { display:block; cursor:pointer; position:absolute; top:-1px; right:3px; color:white; font-weight:bold; } +.validetta-inline, .validetta-bubble { display:block; font:12px/14px Arial, Helvetica, sans-serif; } +.validetta-inline { color:#CD2E26; } diff --git a/validetta.jquery.json b/validetta.jquery.json index d104db9..f56eaa2 100644 --- a/validetta.jquery.json +++ b/validetta.jquery.json @@ -1,6 +1,6 @@ { "name" : "validetta", - "version" : "0.8.0", + "version" : "0.9.0", "title" : "Validetta - A tiny jquery plugin for validate your forms", "description" : "Validetta is a tiny jQuery plugin which you can do client-side validation of your forms. It aims to decrease your burden with easy usage and flexible structure.", "keywords" : ["validetta", "form", "forms", "jquery", "javascript", "validation", "validate"], @@ -8,7 +8,7 @@ "docs" : "http://lab.hasanaydogdu.com/validetta/", "demo" : "http://lab.hasanaydogdu.com/validetta/#examples", "bugs" : "http://github.com/hsnayd/validetta/issues", - "download" : "http://github.com/hsnayd/validetta/archive/v0.8.0.zip", + "download" : "http://github.com/hsnayd/validetta/archive/v0.9.0.zip", "author" : { "name": "Hasan Aydoğdu", "url" : "http://github.com/hsnayd" diff --git a/validetta.js b/validetta.js index 6ad8cd2..df11354 100644 --- a/validetta.js +++ b/validetta.js @@ -1,6 +1,6 @@ /*! * Validetta - Client-side form validation jQuery plugin - * Version: 0.8.0 (13 December 2013) + * Version: 0.9.0 (16 February 2014) * @jQuery Requires: v1.7 or above * @Browser Support : ie8 or above, and all modern browsers * @@ -50,8 +50,10 @@ * Plugin defaults */ var defaults = { - errorClass : 'validetta-error', // The html class which to be added to error message window - errorCloseClass : 'validetta-errorClose', // The html class that will add on element of HTML which is closing the error message window + display : 'bubble', // Error display options, // bubble / inline + errorClass : 'validetta-bubble', // The html class which to be added to error message window + errorClose : true, // Error windows close button. if you want to active it, set is true + errorCloseClass : 'validetta-bubbleClose', // The html class that will add on element of HTML which is closing the error message window ajax : { // Ajax processing call : false, // If you want to make an ajax request, set it to true type : 'GET', @@ -71,7 +73,7 @@ * * @param {object} form :
element which being controlled * @param {object} options : User-specified settings - * @return {method} events + * @return {method} events */ Validetta = function( form, options ){ /** @@ -88,12 +90,12 @@ /** * @method events * This is the method of handling events - * + * * @return {method} init, {method} reset or {boolean} false */ Validetta.prototype.events = function(){ var that = this; // stored this - // Handle submit event + // Handle submit event $( this.form ).submit( function( e ){ // fields to be controlled transferred to global variable fields = this.querySelectorAll( '[data-validetta]' ); @@ -118,15 +120,18 @@ $( this.form ).find( '[type=reset]' ).on( 'click', function(){ return that.reset.call( that ); }); - // error messages manually cleaning function - // handle error close button to manually clearing error messages - $( this.form ).on( 'click', '.'+this.options.errorCloseClass, function(){ - // We're checking the parent value of clicked element to avoid getting error - // if parent value is true, clear error window - var _errProp = this.parentNode; - if( _errProp ){ that.window.close.call( that, _errProp ); } - return false; - }); + // Error close button is active ? + if( this.options.errorClose ) { + // error messages manually cleaning function + // handle error close button to manually clearing error messages + $( this.form ).on( 'click', '.'+this.options.errorCloseClass, function(){ + // We're checking the parent value of clicked element to avoid getting error + // if parent value is true, clear error window + var _errProp = this.parentNode; + if( _errProp ){ that.window.close.call( that, _errProp ); } + return false; + }); + } }; /** * @method init @@ -137,17 +142,17 @@ */ Validetta.prototype.init = function( e ){ var that = this; // stored this - // Reset error windows from all elements + // Reset error windows from all elements this.reset.call( this, fields ); // Start control each elements for ( var i = fields.length - 1; i >= 0; i-- ) { /** * Declaring variables - * + * * @params {object} _el : current field * @params {string} _errors : current field's errors * @params {array} _val : current field's value - * @params {array} _methods : current field's control methods + * @params {array} _methods : current field's control methods */ var _el, _errors, _val = [], _methods = []; _el = fields[i]; @@ -184,7 +189,7 @@ // And start to check rules // {count} which used below is the specified maximum or minimum value // e.g if method is minLength and rule is 2 ( minLength[2] ) - // Output error windows text will be : 'Please select minimum 2 options. ' + // Output error windows text will be : 'Please select minimum 2 options.' var rules = _methods[j].split( /\[|,|\]/ ); if( rules[0] === 'maxLength' && !that.check.maxLength( _val, rules[1] ) ){ _errors += messages.maxLength.replace( '{count}', rules[1] )+'
'; @@ -237,7 +242,7 @@ empty : function( val ){ return ( this.clear( val ) === '' ) ? false : true; }, - // Mail check - it checks the value if it's a valid email address or not//Gelen değerin geçerli bir eposta adresi olup olmadığını kontrol eder + // Mail check - it checks the value if it's a valid email address or not mail : function( val ){ return ( ( regMail.test( val ) === false ) && val !== '' ) ? false : true ; }, @@ -260,7 +265,7 @@ }, /** * Credit Card Control - * @from : http://af-design.com/blog/2010/08/18/validating-credit-card-numbers + * @from : http://af-design.com/blog/2010/08/18/validating-credit-card-numbers */ creditCard : function( val ){ var reg, cardNumber, pos, digit, i, sub_total, sum = 0, strlen; @@ -312,7 +317,7 @@ return ( val !== null && val !== '' && val.length < arg ) ? false : true ; } }, - // Radio + // Radio radio : function ( _inp ) { var count = $( this.form.querySelectorAll( 'input[type=radio][name="'+ _inp.name +'"]' ) ).filter( ':checked' ).length ; return ( count === 1 ) ? false : true ; @@ -340,32 +345,37 @@ if( typeof _inpParent === 'undefined' ){ _inpParent = _inp[0].parentNode ; } // if there is an error window which previously opened for _inp, return if( $( _inpParent ).find( '.'+this.options.errorClass ).length > 0 ){ return ; } - var pos, W, H, T, errorObject, errorCloseObject ; - // !! Here, JQuery functions are using to support the IE8 - pos = $( _inp ).position(); - // !! Here, JQuery functions are using to support the IE8 - W = $( _inp ).width(); - H = $( _inp ).height(); - T= pos.top ; // Create the error window object which will be appear - errorObject = document.createElement( 'span' ); - errorObject.className = this.options.errorClass ; - // Create the element which use to close the error window - errorCloseObject = document.createElement( 'span' ); - errorCloseObject.innerHTML = 'x'; - errorCloseObject.className = this.options.errorCloseClass ; - $(errorObject).empty().css({ - 'left':pos.left+W+30+'px', - 'top' :T+'px' - }); + var errorObject = document.createElement( 'span' ); + errorObject.className = this.options.errorClass; + // if error display is bubble, calculate to positions + if( this.options.display === 'bubble' ){ + var pos, W, H, T; + // !! Here, JQuery functions are using to support the IE8 + pos = $( _inp ).position(); + // !! Here, JQuery functions are using to support the IE8 + W = $( _inp ).width(); + H = $( _inp ).height(); + T= pos.top ; + $( errorObject ).empty().css({ + 'left':pos.left+W+30+'px', + 'top' :T+'px' + }); + } _inpParent.appendChild( errorObject ); errorObject.innerHTML = error ; - errorObject.appendChild( errorCloseObject ); + // if errorClose is activated, create the element which use to close the error window + if( this.options.errorClose ){ + var errorCloseObject = document.createElement( 'span' ); + errorCloseObject.innerHTML = 'x'; + errorCloseObject.className = this.options.errorCloseClass ; + errorObject.appendChild( errorCloseObject ); + } // we have an error so we need to break submit // set to handler true this.handler = true ; }, - /** + /** * @property : close * @params _inp : the error message window which will be disappear */ @@ -400,7 +410,7 @@ * @method clear * Clears the left and right spaces of parameter. * @param {string} value - * @return {String} + * @return {String} */ Validetta.prototype.clear = function( value ){ return value.replace( /^\s+|\s+$/g, '' );