jQuery validate: come aggiungere una regola per la convalida delle espressioni regolari?

Sto usando il plugin di validazione jQuery . Grandi cose! Voglio migrare la mia soluzione ASP.NET esistente per utilizzare jQuery invece dei validatori ASP.NET. Mi manca una sostituzione per il validatore di espressioni regolari . Voglio essere in grado di fare qualcosa del genere:

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

Come posso aggiungere una regola personalizzata per raggiungere questo objective?

Grazie alla risposta di redsquare ho aggiunto un metodo come questo:

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

ora tutto ciò che devi fare per convalidare qualsiasi regex è questo:

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

Inoltre, sembra che esista un file chiamato additional-methods.js che contiene il metodo “pattern”, che può essere un RegExp quando viene creato utilizzando il metodo senza virgolette.

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

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

Puoi usare addMethod ()

per esempio

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

buon articolo qui https://web.archive.org/web/20130609222116/http://www.randallmorey.com/blog/2008/mar/16/extending-jquery-form-validation-plugin/

Ho avuto qualche problema nel mettere insieme tutti i pezzi per fare un validatore di espressioni regolari jQuery, ma ho avuto modo di funzionare … Ecco un esempio operativo completo. Usa il plugin ‘Validation’ che può essere trovato in jQuery Plugin di convalida

          

Log In

Nessun motivo per definire la regex come una stringa.

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

e

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

meglio così, no?

Come menzionato nella documentazione di addMethod :

Nota: sebbene la tentazione sia ottima per aggiungere un metodo regex che controlli il suo parametro rispetto al valore, è molto più pulito incapsulare le espressioni regolari all’interno del proprio metodo. Se hai bisogno di molte espressioni leggermente diverse, prova ad estrarre un parametro comune. Una libreria di espressioni regolari: http://regexlib.com/DisplayPatterns.aspx

Quindi sì, devi aggiungere un metodo per ogni espressione regolare. Il sovraccarico è minimo, mentre consente di dare alla regex un nome (non da sottovalutare), un messaggio predefinito (a portata di mano) e la possibilità di riutilizzarlo in vari punti, senza duplicare la regex più e più volte.

Estendendo la risposta di PeterTheNiceGuy un po ‘:

 $.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." ); 

Ciò consentirebbe di passare un object regex alla regola.

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

La reimpostazione della proprietà lastIndex è necessaria quando g -flag è impostato sull’object RegExp . Altrimenti inizierà a convalidare dalla posizione dell’ultima corrispondenza con quella regex, anche se la stringa dell’object è diversa.

Alcune altre idee che ho avuto sono state di abilitarvi ad usare array di regex, e un’altra regola per la negazione di regex:

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

Ma implementare quelli potrebbe essere troppo.

L’ho fatto funzionare così:

 $.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' } } }); }); 

Assicurati che la regex sia tra / 🙂

Questo è un codice funzionante.

 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: "eg +91-1234567890" }, }, submitHandler: function (form) { return true; } }); } 

Puoi utilizzare lo pattern definito nel file additional-methods.js . Si noti che questo file additional-methods.js deve essere incluso dopo la dipendenza da jQuery Validate, quindi si può semplicemente usare

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

utilizziamo principalmente la notazione di markup del plugin di validazione jquery e gli esempi pubblicati non hanno funzionato per noi, quando i flag sono presenti nella regex, ad es.

  

quindi usiamo il seguente frammento

 $.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." ); 

Ovviamente ora è ansible combinare questo codice, con uno dei precedenti per consentire anche il passaggio degli oggetti RegExp nel plugin, ma poiché non ne avevamo bisogno abbiamo lasciato questo esercizio per il lettore ;-).

PS: c’è anche un plugin in bundle per questo, https://github.com/jzaefferer/jquery-validation/blob/master/src/additional/pattern.js

Questo ha funzionato per me, essendo una delle regole di convalida:

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

Spero che sia d’aiuto