jQuery validate: ¿Cómo agregar una regla para la validación de expresiones regulares?

208

Estoy usando el jQuery complemento de validación. ¡Buena cosa! Deseo migrar mi solución ASP.NET existente para usar jQuery en lugar de los validadores de ASP.NET. Me falta un reemplazo para el validador de expresión regular . Quiero ser capaz de hacer algo como esto:jQuery validate: ¿Cómo agregar una regla para la validación de expresiones regulares?

$("Textbox").rules("add", { regularExpression: "^[a-zA-Z'.\s]{1,40}$" })

¿Cómo añadir una regla personalizada para lograr esto?

Fuente

2008-11-11 PeterFromCologne

+109

OMG es ** ** NO tiene la validación de expresiones regulares ?! –

quiero decir, que quisiera expresiones regulares para la validación de todos modos ... ...;) – jamiebarrow

Por favor, digamos que está comprobando el lado del servidor de entrada y no sólo confiar en la validación del lado del cliente, ya que, obviamente, se puede apagar. –

290

Gracias a la respuesta de redsquare he añadido un método como este:

$.validator.addMethod(
     "regex", 
     function(value, element, regexp) { 
      var re = new RegExp(regexp); 
      return this.optional(element) || re.test(value); 
     }, 
     "Please check your input." 
);

ahora todo lo que necesita hacer para validar contra cualquier expresión regular es esto:

$("#Textbox").rules("add", { regex: "^[a-zA-Z'.\\s]{1,40}$" })

Además, parece que hay un archivo llamado adicionales-methods.js que contiene el método "patrón", que puede ser una expresión regular cuando se crean usando el método sin comillas.

http://bassistance.de/jquery-plugins/jquery-plugin-validation/

http://ajax.aspnetcdn.com/ajax/jquery.validate/1.9/additional-methods.js

Fuente

2009-04-02 11:38:38 PeterFromCologne

¿Cuál es el objetivo de la asignación de variable no utilizada "var check = false;"? "verificar" no está marcado en ninguna parte, juego de palabras. –

$ ("Cuadro de texto") debe ser $ ("# Textbox"). –

Funciona para mí, gracias: +1 –

Puede utilizar el addMethod()

por ejemplo

$.validator.addMethod('postalCode', function (value) { 
    return /^((\d{5}-\d{4})|(\d{5})|([A-Z]\d[A-Z]\s\d[A-Z]\d))$/.test(value); 
}, 'Please enter a valid US or Canadian postal code.');

buen artículo aquí https://web.archive.org/web/20130609222116/http://www.randallmorey.com/blog/2008/mar/16/extending-jquery-form-validation-plugin/

Fuente

2008-11-11 14:01:39 redsquare

Realmente no responde la pregunta.¿Qué pasa si quieres una regla general de expresiones regulares? Con esta respuesta, deberías agregarMétodo para cada expresión regular diferente. – AndreasN

+19

si tiene una mejor respuesta, siéntase libre .... – redsquare

Extendiendo un poco la respuesta de PeterTheNiceGuy:

$.validator.addMethod(
     "regex", 
     function(value, element, regexp) { 
      if (regexp.constructor != RegExp) 
       regexp = new RegExp(regexp); 
      else if (regexp.global) 
       regexp.lastIndex = 0; 
      return this.optional(element) || regexp.test(value); 
     }, 
     "Please check your input." 
);

Esto permitirá pasar un objeto de expresión regular a la regla.

$("Textbox").rules("add", { regex: /^[a-zA-Z'.\s]{1,40}$/ });

Restablecimiento de la propiedad lastIndex es necesario cuando el -flag g se establece en el objeto RegExp. De lo contrario, comenzaría a validarse desde la posición de la última coincidencia con esa expresión regular, incluso si la cadena del sujeto es diferente.

Algunas otras ideas que tenía era ser permitir que utiliza matrices de expresiones regulares de, y otra regla para la negación de expresiones regulares de:

$("password").rules("add", { 
    regex: [ 
     /^[a-zA-Z'.\s]{8,40}$/, 
     /^.*[a-z].*$/, 
     /^.*[A-Z].*$/, 
     /^.*[0-9].*$/ 
    ], 
    '!regex': /password|123/ 
});

Pero la implementación de los tendrían tal vez sea demasiado.

Fuente

2009-05-09 16:40:21

Quiero expresión regular validación en forma adicional de JQgrid. ¿Cómo puedo hacer eso? –

@BhavikAmbani Puede usar una función personalizada para la validación. Consulte [la wiki] (http://www.trirand.com/jqgridwiki/doku.php?id=wiki : common_rules # editrules) para un ejemplo. –

Como se ha mencionado en el addMethod documentation:

Tenga en cuenta: Si bien es grande la tentación de añadir un método de expresiones regulares que comprueba que es el parámetro con el valor, que es mucho más limpio para encapsular las expresiones regulares dentro de su propio método. Si necesita muchas expresiones ligeramente diferentes, intente extraer un parámetro común. Una biblioteca de expresiones regulares: http://regexlib.com/DisplayPatterns.aspx

Así que sí, tiene que agregar un método para cada expresión regular.La sobrecarga es mínima, mientras que le permite dar un nombre a la expresión regular (no debe subestimarse), un mensaje predeterminado (útil) y la capacidad de reutilizarlo en varios lugares, sin duplicar la expresión regular una y otra vez.

Fuente

2009-05-14 12:03:37

¡Su respuesta es muy apreciada! Gracias. Volveré a pensar en ello. En nuestro caso, la validación de Regex parecía ser la mejor opción. Sin embargo, entiendo su punto al usar validaciones "nombradas". .. – PeterFromCologne

Quiero validación de expresiones regulares en forma de JQgrid. Cómo puedo hacer eso ? –

he tenido algunos problemas para poner juntas todas las piezas para hacer un validador de expresión regular jQuery, pero yo tengo que trabajar ... Aquí es un ejemplo de trabajo completa. Utiliza el plugin de 'validación' que se puede encontrar en jQuery Validation Plugin

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
    <script src="http://YOURJQUERYPATH/js/jquery.js" type="text/javascript"></script> 
    <script src="http://YOURJQUERYPATH/js/jquery.validate.js" type="text/javascript"></script> 
    <script type="text/javascript"> 

     $().ready(function() { 
      $.validator.addMethod("EMAIL", function(value, element) { 
       return this.optional(element) || /^[a-zA-Z0-9._-][email protected][a-zA-Z0-9-]+\.[a-zA-Z.]{2,5}$/i.test(value); 
      }, "Email Address is invalid: Please enter a valid email address."); 

      $.validator.addMethod("PASSWORD",function(value,element){ 
       return this.optional(element) || /^(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,16}$/i.test(value); 
      },"Passwords are 8-16 characters with uppercase letters, lowercase letters and at least one number."); 

      $.validator.addMethod("SUBMIT",function(value,element){ 
       return this.optional(element) || /[^ ]/i.test(value); 
      },"You did not click the submit button."); 

      // Validate signup form on keyup and submit 
      $("#LOGIN").validate({ 
       rules: { 
        EMAIL: "required EMAIL", 
        PASSWORD: "required PASSWORD", 
        SUBMIT: "required SUBMIT", 
       }, 
      }); 
     }); 
    </script> 
</head> 
<body> 
    <div id="LOGIN_FORM" class="form"> 
     <form id="LOGIN" name="LOGIN" method="post" action="/index/secure/authentication?action=login"> 
      <h1>Log In</h1> 
      <div id="LOGIN_EMAIL"> 
       <label for="EMAIL">Email Address</label> 
       <input id="EMAIL" name="EMAIL" type="text" value="" tabindex="1" /> 
      </div> 
      <div id="LOGIN_PASSWORD"> 
       <label for="PASSWORD">Password</label> 
       <input id="PASSWORD" name="PASSWORD" type="password" value="" tabindex="2" /> 
      </div> 
      <div id="LOGIN_SUBMIT"> 
       <input id="SUBMIT" name="SUBMIT" type="submit" value="Submit" tabindex="3" /> 
      </div> 
     </form> 
    </div> 
</body> 
</html>

Fuente

2009-08-01 19:54:30 bshack

Gracias, utilizando su ejemplo completo de trabajo me permitió implementar esto. Las otras respuestas no funcionaron para mí. –

@bsjack Increíble, esto es exactamente lo que he estado buscando, gracias por el ejemplo detallado y completo. (Y) –

No hay razón para definir la expresión regular como una cadena.

$.validator.addMethod(
    "regex", 
    function(value, element, regexp) { 
     var check = false; 
     return this.optional(element) || regexp.test(value); 
    }, 
    "Please check your input." 
);

telephone: { required: true, regex : /^[\d\s]+$/, minlength: 5 },

Es mejor de esta manera, no?

Fuente

2010-01-11 07:00:14 Sam

que js se requiere para esto? –

En realidad, acabo de encontrar un problema con esto. Si usa el indicador g, obtendrá resultados inconsistentes. El indicador g crea aparentemente su propio índice (ver: http://stackoverflow.com/questions/209732/why-am-i-seeing-inconsistent-javascript-logic-behavior-looping-with-an-alert-v). Por lo tanto, debe redefinir la expresión regular IN de la función para que se vuelva a crear cada vez que se la llame. –

Para agregar a eso: aún así defínalo como una expresión regular, como se indicó anteriormente (o tendrá problemas con la cadena> conversión de expresiones regulares con indicadores) PERO además necesita la 'var re = nueva RegExp (regexp);' en función –

Yo tengo que trabajar de esta manera:

$.validator.addMethod(
    "regex", 
    function(value, element, regexp) { 
     var check = false; 
     return this.optional(element) || regexp.test(value); 
    }, 
    "Please check your input." 
); 


$(function() { 
    $('#uiEmailAdress').focus(); 
    $('#NewsletterForm').validate({ 
     rules: { 
      uiEmailAdress:{ 
       required: true, 
       email: true, 
       minlength: 5 
      }, 
      uiConfirmEmailAdress:{ 
       required: true, 
       email: true, 
       equalTo: '#uiEmailAdress' 
      }, 
      DDLanguage:{ 
       required: true 
      }, 
      Testveld:{ 
       required: true, 
       regex: /^[0-9]{3}$/ 
      } 
     }, 
     messages: { 
      uiEmailAdress:{ 
       required: 'Verplicht veld', 
       email: 'Ongeldig emailadres', 
       minlength: 'Minimum 5 charaters vereist' 
      }, 
      uiConfirmEmailAdress:{ 
       required: 'Verplicht veld', 
       email: 'Ongeldig emailadres', 
       equalTo: 'Veld is niet gelijk aan E-mailadres' 
      }, 
      DDLanguage:{ 
       required: 'Verplicht veld' 
      }, 
      Testveld:{ 
       required: 'Verplicht veld', 
       regex: '_REGEX' 
      } 
     } 
    }); 
});

Asegúrese de que la expresión regular es entre / :-)

Fuente

2010-10-31 10:39:11

Quiero la validación de expresiones regulares en forma de JQgrid. Cómo puedo hacer eso ? –

utilizamos principalmente la notación de marcado de jQuery plugin de validación y la las muestras publicadas no nos funcionaron, cuando las banderas están presentes en la expresión regular, por ejemplo

<input type="text" name="myfield" regex="/^[0-9]{3}$/i" />

por lo tanto, utilizamos el siguiente fragmento

$.validator.addMethod(
     "regex", 
     function(value, element, regstring) { 
      // fast exit on empty optional 
      if (this.optional(element)) { 
       return true; 
      } 

      var regParts = regstring.match(/^\/(.*?)\/([gim]*)$/); 
      if (regParts) { 
       // the parsed pattern had delimiters and modifiers. handle them. 
       var regexp = new RegExp(regParts[1], regParts[2]); 
      } else { 
       // we got pattern string without delimiters 
       var regexp = new RegExp(regstring); 
      } 

      return regexp.test(value); 
     }, 
     "Please check your input." 
);

Por supuesto, ahora se podría combinar este código, con uno de los anteriores también permiten a los objetos que pasan RegExp en el plugin, pero ya que no lo necesitamos, dejamos este ejercicio para el lector ;-).

PS: también se incluye plug-in para que, https://github.com/jzaefferer/jquery-validation/blob/master/src/additional/pattern.js

Fuente

2014-04-02 14:34:14 staabm

Este es el código de trabajo.

function validateSignup() 
{ 
    $.validator.addMethod(
      "regex", 
      function(value, element, regexp) 
      { 
       if (regexp.constructor != RegExp) 
        regexp = new RegExp(regexp); 
       else if (regexp.global) 
        regexp.lastIndex = 0; 
       return this.optional(element) || regexp.test(value); 
      }, 
      "Please check your input." 
    ); 

    $('#signupForm').validate(
    { 

     onkeyup : false, 
     errorClass: "req_mess", 
     ignore: ":hidden", 
     validClass: "signup_valid_class", 
     errorClass: "signup_error_class", 

     rules: 
     { 

      email: 
      { 
       required: true, 
       email: true, 
       regex: /^[A-Za-z0-9_]+\@[A-Za-z0-9_]+\.[A-Za-z0-9_]+/, 
      }, 

      userId: 
      { 
       required: true, 
       minlength: 6, 
       maxlength: 15, 
       regex: /^[A-Za-z0-9_]{6,15}$/, 
      }, 

      phoneNum: 
      { 
       required: true, 
       regex: /^[+-]{1}[0-9]{1,3}\-[0-9]{10}$/, 
      }, 

     }, 
     messages: 
     { 
      email: 
      { 
       required: 'You must enter a email', 
       regex: 'Please enter a valid email without spacial chars, ie, [email protected]' 
      }, 

      userId: 
      { 
       required: 'Alphanumeric, _, min:6, max:15', 
       regex: "Please enter any alphaNumeric char of length between 6-15, ie, sbp_arun_2016" 
      }, 

      phoneNum: 
      { 
       required: "Please enter your phone number", 
       regex: "e.g. +91-1234567890"  
      }, 

     }, 

     submitHandler: function (form) 
     { 
      return true; 
     } 
    }); 
}

Fuente

2016-04-26 13:56:25

Gracias @Paul. Lo hiciste muy bien. –

Esto funcionó para mí, siendo una de las reglas de validación:

Zip: { 
       required: true, 
       regex: /^\d{5}(?:[-\s]\d{4})?$/ 
      }

creo que sirve

Fuente

2016-06-01 08:17:22

Es posible utilizar pattern definido en el archivo additional-methods.js. Tenga en cuenta que este archivo adicional-methods.js debe incluirse después dependencia jQuery Validar, a continuación, puedes utilizar

$("#frm").validate({ 
 
    rules: { 
 
     Textbox: { 
 
      pattern: /^[a-zA-Z'.\s]{1,40}$/ 
 
     }, 
 
    }, 
 
    messages: { 
 
     Textbox: { 
 
      pattern: 'The Textbox string format is invalid' 
 
     } 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.17.0/jquery.validate.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.17.0/additional-methods.min.js"></script> 
 
<form id="frm" method="get" action=""> 
 
    <fieldset> 
 
     <p> 
 
      <label for="fullname">Textbox</label> 
 
      <input id="Textbox" name="Textbox" type="text"> 
 
     </p> 
 
    </fieldset> 
 
</form>

Fuente

2017-11-07 17:03:45

jQuery validate: ¿Cómo agregar una regla para la validación de expresiones regulares?

Respuesta

Cuestiones relacionadas