Résumé des validations courantes pour Extjs Forms_extjs

Copier le code Le code est le suivant :

//Placez-le dans la fonction onReady(){}
Ext.QuickTips.init(); //Fournir une fonction d'information d'invite pour les composants. Les principales informations d'invite du formulaire sont le message d'erreur de vérification du client.
Ext.form.Field.prototype.msgTarget='side'; //Méthode d'invite, la valeur d'énumération est :

qtip-Afficher l'invite lorsque la souris se déplace sur le contrôle ; titre-affiché dans le titre du navigateur, mais le résultat du test est le même que celui de qtip ;
sous-affiche un message d'erreur sous le contrôle
side-affiche une icône d'erreur sur le côté droit du contrôle lorsque ; la souris pointe sur l'icône Afficher l'invite d'erreur. La valeur par défaut
id-[element id] est affichée dans l'élément HTML de l'identifiant spécifié

1. >

Copier le code Le code est le suivant :

//Deux paramètres de vérification nulle

allowBlank :false//false ne peut pas être vide, la valeur par défaut est vraie
blankText:string//Le message d'erreur lorsqu'il est vide


le code js est :

Copier le code Le code est le suivant :

var form1 = new Ext.form.FormPanel({

width:350,
renderTo :"form1",
title:"FormPanel",
valeurs par défaut :{xtype:"textfield",inputType:"password"},
items:[
{fieldLabel:" ne peut pas être vide",
allowBlank : false, //Null n'est pas autorisé
blankText : "Ne peut pas être vide", //Message d'erreur, la valeur par défaut est Ce champ est obligatoire !
id : "blanktest" ,
}
]
});


2. Utilisez le format vtype pour une vérification simple.

Voici un exemple de vérification d'email, réécrivez la configuration des éléments du code ci-dessus :

Copiez le code Le code est comme suit :

items :[

{fieldLabel:"cannot be empty",
vtype:"email",//vérification du format de l'e-mail
vtypeText:"pas valide adresse email",/ /Message d'erreur, je ne mentionnerai pas les valeurs par défaut
id : "blanktest",
ancre : "90%"
}
Vous pouvez modifier le vtype ci-dessus aux vérifications extjs suivantes prises en charge par vtype par défaut :
//Type de vtype pris en charge par défaut dans la vérification du formulaire


1.alpha //Seules les lettres peuvent être saisies, les autres (comme les chiffres, symboles spéciaux, etc.) ne peuvent pas être saisis

2.alphanum//Seuls les lettres et les chiffres peuvent être saisis, les autres ne peuvent pas être saisis
3.email//vérification par e-mail, le format requis est ""
4 Vérification du format .url//url, le format requis est http://www.baidu.com

3. Vérification avancée du mot de passe personnalisé
Les vérifications précédentes sont toutes fournies par extjs, et nous pouvons également personnaliser la fonction de vérification.

Copier le code Le code est le suivant :

//Utilisez d'abord la méthode Ext.apply pour ajouter une fonction de vérification de mot de passe personnalisée (peut également recevoir d'autres noms)

Ext.apply(Ext.form.VTypes,{
password:function(val,field){//val fait référence à la valeur de la zone de texte ici , le champ fait référence à ce composant de zone de texte, tout le monde doit comprendre cette signification
if(field.confirmTo){//confirmTo est notre paramètre de configuration personnalisé, qui est généralement utilisé pour enregistrer la valeur d'identification des autres composants
var pwd =Ext.get( field.confirmTo);//Obtenir la valeur de l'identifiant de confirmTo
return (val==pwd.getValue());
}
return true; 🎜>});
//Configurer les paramètres des éléments
items : [{fieldLabel : "Password",
id : "pass1",
},{
fieldLabel : "Confirmer le mot de passe" ,
id : "pass2",
vtype : "password", // Type de vérification personnalisé
vtypeText : "Deux mots de passe sont incohérents !",
confirmTo : "pass1", // Un autre pour comparer l'identifiant du composant
}


4. Utilisez des expressions régulières pour vérifier

Copier le code

Codez comme suit : new Ext.form.TextField({ fieldLabel : "name",

name : "author_nam",

regex : /[u4e00-u9fa5] /, //L'expression régulière est entre /...../. [u4e00-u9fa5] : Seul le chinois peut être saisi
regexText : "Seul le chinois peut être saisi !", //Message d'erreur d'expression régulière<.>allowBlank : false //Cette vérification est toujours valide. Elle ne peut pas être vide

.