Validator TEXTFIELD extjs4

**jerada** · 13/03/2014, 11h49

Bonjour

S'il vous plait comment faire un validator extjs4

par exemple

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
 editor: {
    xtype: 'textfield',
    itemId: 'test,
    allowBlank: false,
    enforceMaxLength: true,
    maxLength: 20,
    regex: /^[A-Za-z]{4}\s\d{6}\-\d{1}$/
}

en fait quand je clique le text field pour ecrire il prend en concideration regex si il est bonne

mais s'il elle n'est pas bonne et quand je passe pour remplir un autre textfield il vide ce que j'ai ecris

je veux meme si ce j'ecris il n'est pas comptatible à regex il m'affiche un message comme quoi il faut entrer la bonne valeur et pas la vider

merci infiniment

**sekaijin** · 13/03/2014, 12h03

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
win = Ext.create('widget.window', {
  title: 'test',
  header: {
    titlePosition: 2,
    titleAlign: 'center'
  },
  closable: true,
  closeAction: 'hide',
  width: 600,
  minWidth: 350,
  height: 350,
  items: [{
    xtype: 'textfield',
    fieldLabel:'regexp',
    itemId: 'test',
    allowBlank: false,
    enforceMaxLength: true,
    maxLength: 20,
    regex: /^[A-Za-z]{4}\s\d{6}\-\d{1}$/
  },{
    xtype: 'textfield',
    itemId: 'test2',
    fieldLabel:'pas de validateur'
  }]
});
win.show();

tu dois avoir un autre problème car le comportement par defaut est de laisser le texte

mais je te conseille d'utiliser VTypes
qui te permet de définir un type de validation
et de l'associer ensuite à tes champs

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
 
// custom Vtype for vtype:'MonType'
Ext.apply(Ext.form.field.VTypes, {
    MonType:  function(v) {
        return /^[A-Za-z]{4}\s\d{6}\-\d{1}$/.test(v);
    },
    MonTypeText: 'Doit être au format "AAAA 123456-1"'
});
 
win = Ext.create('widget.window', {
  title: 'test',
  header: {
    titlePosition: 2,
    titleAlign: 'center'
  },
  closable: true,
  closeAction: 'hide',
  width: 600,
  minWidth: 350,
  height: 350,
  items: [{
    xtype: 'textfield',
    fieldLabel:'regexp',
    itemId: 'test',
    allowBlank: false,
    enforceMaxLength: true,
    maxLength: 20,
    vtype:'MonType'
  },{
    xtype: 'textfield',
    itemId: 'test2',
    fieldLabel:'pas de validateur'
  }]
});
win.show();

A+JYT

**jerada** · 13/03/2014, 13h54

Bonjour sekaijin,

Même si j'ai ajouté vtype et que je l'ai associé à mon textfield.

Même si j’écris dans la zone de text et que je veux écrire dans l'autre zone, il vide la zone comme si empty.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
 editor: {
     xtype: 'textfield',
     itemId: 'newClientLCNFieldEditing',
     invalidText: 'Le text doit etre à ce format ABC_ 11chiffre_4lettre',
     allowBlank: false,
     enforceMaxLength: true,
     maxLength: 20,
     regex: /^[A-Za-z]{4}\s\d{6}\-\d{1}$/,
     regexText: 'You must enter exactly 4 digits in this field',
     vtype: 'alphanum'
}

Je ne sais pas pourquoi.
Est-ce parce que je vais utiliser les deux en même temps ?
Mon objectif c'est : quand je saisi une valeur dans la zone et qu'elle n'est pas compatible avec la regex, alors il affiche un erreur.

Merci.

**abraxis** · 13/03/2014, 14h17

Peux tu nous montrer le code du VType stp ?
Si tu utilise un VType tu n'as plus besoin de mettre ces deux lignes

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
 
regex: /^[A-Za-z]{4}\s\d{6}\-\d{1}$/,
regexText: 'You must enter exactly 4 digits in this field',

Ici un petit lien vers la doc pour les VTypes.

**jerada** · 13/03/2014, 16h13

bonjour

il ya 4 type de vtype dans sencha architect => alpha , alphanum , email ,url

mais si je vais chosir alphanum je peux ecrire les 2 mais en fait moi je veux donner un text precis à mon textfield

Comme celui la ABC_(4chiffre)_(se termine avec 4 lettre ) obligatoire c'est pour ça j'ai trouver regex mais le probleme quand je saisie ma saisie et quand je passe a une autre textfield il vide le textfield (mais si il est fausse )

j'espere que vous m'aviez compris merci

**abraxis** · 13/03/2014, 16h24

Non, il y a 4 VTypes proposé de base mais il est y parfaitement possible de faire sont propre VTypes.

Dans la doc il est noté "To create custom VTypes".
sekaijin, dans sont message plus haut a donné un exemple d'un VTypes personnalisé.