Ver Mensaje Individual
  #2 (permalink)  
Antiguo 17/01/2014, 06:06
helenp
 
Fecha de Ingreso: mayo-2009
Mensajes: 382
Antigüedad: 15 años, 6 meses
Puntos: 6
Respuesta: validacion con javascript

Esta es la parte editable del script
Código Javascript:
Ver original
  1. var Validate = new Class({ 
  2.     getOptions: function(){
  3.         return {
  4.             validateOnBlur: true,
  5.             errorClass: 'error',
  6.             errorMsgClass: 'errorMessage',
  7.             dateFormat: 'dd/MM/yy',
  8.             onFail: Class.empty,
  9.             onSuccess: false,
  10.             showErrorsInline: true,
  11.             label: 'Please wait...'};},
  12.     initialize: function(form, options){
  13.         this.setOptions(this.getOptions(), options);       
  14.         this.form = $(form);
  15.         this.elements = this.form.getElements('.required');
  16.         this.list = [];    
  17.         this.elements.each(function(el,i){
  18.             if(this.options.validateOnBlur){
  19.                 el.addEvent('blur', this.validate.bind(this, el));          }
  20.         }.bind(this));     
  21.         this.form.addEvent('submit', function(e){
  22.             var event = new Event(e);
  23.             var doSubmit = true;
  24.             this.elements.each(function(el,i){
  25.                 if(! this.validate(el)){
  26.                     event.stop();
  27.                     doSubmit = false
  28.                     this.list.include(el);
  29.                 }else{
  30.                     this.list.remove(el);               }
  31.             }.bind(this));         
  32.             if(doSubmit){
  33.                 if(this.options.onSuccess){
  34.                     event.stop();
  35.                     this.options.onSuccess(this.form);
  36.                 }else{
  37.                     this.form.getElement('input[type=submit]').setProperty('value',this.options.label);             }
  38.             }else{
  39.                 this.options.onFail(this.getList());            }          
  40.         }.bind(this));          }, 
  41.     getList: function(){
  42.         var list = new Element('ul');
  43.         this.list.each(function(el,i){
  44.             if(el.title != ''){
  45.             var li = new Element('li').injectInside(list);
  46.             new Element('label').setProperty('for', el.id).setText(el.title).injectInside(li);          }
  47.         });
  48.         return list;    }, 
  49.     validate: function(el){
  50.         var valid = true;
  51.         this.clearMsg(el);     
  52.         switch(el.type){
  53.             case 'text':
  54.             case 'textarea':
  55.             case 'select-one':
  56.                 if(el.value != ''){
  57.                     if(el.hasClass('email')){
  58.                         var regEmail = /^[A-Z0-9._%-]+@[A-Z0-9.-]+\.[A-Z]{2,4}$/;
  59.                         if(el.value.toUpperCase().match(regEmail)){
  60.                             valid = true;
  61.                         }else{
  62.                             valid = false;
  63.                             this.setMsg(el, 'Please enter a valid email address');                      }                   }                  
  64.                     if(el.hasClass('number')){
  65.                         var regNum = /[-+]?[0-9]*\.?[0-9]+/;
  66.                         if(el.value.match(regNum)){
  67.                             valid = true;
  68.                         }else{
  69.                             valid = false;
  70.                             this.setMsg(el, 'Please enter a valid number');                     }                   }                  
  71.                     if(el.hasClass('postcode')){
  72.                         var regPC = /^([Gg][Ii][Rr] 0[Aa]{2})|((([A-Za-z][0-9]{1,2})|(([A-Za-z][A-Ha-hJ-Yj-y][0-9]{1,2})|(([A-Za-z][0-9][A-Za-z])|([A-Za-z][A-Ha-hJ-Yj-y][0-9]?[A-Za-z])))) [0-9][A-Za-z]{2})$/
  73.                         if(el.value.match(regPC)){
  74.                             valid = true;
  75.                         }else{
  76.                             valid = false;
  77.                             this.setMsg(el, 'Please enter a valid postcode');                   }                   }                  
  78.                     if(el.hasClass('date')){
  79.                         var d = Date.parseExact(el.value, this.options.dateFormat);
  80.                         if(d != null){
  81.                             valid = true;
  82.                         }else{
  83.                             valid = false;
  84.     this.setMsg(el, 'Please enter a valid date in the format: '+this.options.dateFormat.toLowerCase());         }               }              
  85.                 }else{
  86.                     valid = false;
  87.                     this.setMsg(el);}
  88.                 break;             
  89.             case 'checkbox':
  90.                 if(!el.checked){
  91.                     valid = false;
  92.                     this.setMsg(el);
  93.                 }else{
  94.                     valid = true;               }
  95.                 break;             
  96.             case 'radio':
  97.                 var rad = $A(this.form[el.name]);
  98.                 var ok = false;
  99.                 rad.each(function(e,i){
  100.                     if(e.checked){
  101.                         ok = true;              }           });
  102.                 if(!ok){
  103.                     valid = false;
  104.                     this.setMsg(rad.getLast(), 'Please select an option');
  105.                 }else{
  106.                     valid = true;
  107.                     this.clearMsg(rad.getLast());               }
  108.                 break;                      }
  109.         return valid;   }, 
  110.     setMsg: function(el, msg){
  111.         if(msg == undefined){
  112.             msg = el.title;     }
  113.         if(this.options.showErrorsInline){
  114.             if(el.error == undefined){
  115.                 el.error = new Element('span').addClass(this.options.errorMsgClass).setText(msg).injectAfter(el);
  116.             }else{
  117.                 el.error.setText(msg);          }
  118.             el.addClass(this.options.errorClass);   }   }, 
  119.     clearMsg: function(el){
  120.         el.removeClass(this.options.errorClass);
  121.         if(el.error != undefined){
  122.             el.error.remove();
  123.             el.error = undefined;       }   }});
  124. Validate.implement(new Options);
  125. Validate.implement(new Events);