ext4 mvc : soumettre un formulaire à l'appuie sur entrée

Version imprimable

15/09/2011, 15h11
kimjoa

ext4 mvc : soumettre un formulaire à l'appuie sur entrée
Bonjours !
Voilà mon problème, ,je voudrait soumette mon formulaire lorsque que l'utilisateur appuie sur entré, sur tout les champs de type textfield.
C'est une fonction que l'on voie dans beaucoup d'ui
Je suis sous ext4 et ce code ne semble pas marcher
Code:

1 2 3 4 5 this.control({ 'users_loginform textfield' : { 'keypress' : function(){alert('ok')} } });
Pourtant quand je remplace le keypress par un blur ou focus, tout marche nikel!

Avez vous Une idée du problème, ou une solution alternative ?
merci

--------

Petite précision, j'utilise ce code pour mon boutton
Code:

1 2 3 4 5 { text : eTv.t('submit'), action: 'submit', type : 'submit' }
Et je suis bien dans un formulaire -> Ext.form.FormPanel ...
Il me semble que dans ext3 un appuie sur entrée dans un textfield lancé le formulaire ....
15/09/2011, 20h32
sekaijin

keymap est ton amis
http://dev.sencha.com/deploy/ext-4.0...xt.util.KeyMap

sinon les listener du field
http://dev.sencha.com/deploy/ext-4.0...-cfg-listeners

ou encore les listeners du formpanel
http://dev.sencha.com/deploy/ext-4.0...-cfg-listeners

A+JYT
15/09/2011, 22h36
kimjoa

salut sekaijin merci de ta réponse :ccool:

Mais malheureusement, ceci ne m'aide pas trop.
En faite je crois qu'il y'a un bug dans le gestion des routes/évènements des contrôleurs, via le système Ext.ComponentQuery .
l’exemple que j'ai présente devrait fonctionner, la route est bonne, mais c'est la définition de l'évènement keypress qui ne marche pas. D'ailleurs c'est tout les évènements clavier, qui ne sont pas pris en compte.

Je crois que je vais adopter une approche plus classique via une classe spéciale, initialisant après lerendu les évènements keypress sur les input.

En tout cas merci ;) keymap risque de bien me servir !

tchusss !

Bon j'ai réussi à trouver en faite :)
Il fallait passer par l'évènement specialkey. Les évènement clavier ne marche pas sinon.

Je vous fournit une version pour extjs 3. Pour la 4 il suffit de suivre les indication qui sont fournit. J'ai juste overrider une fonction, mais on pourrait passer par une nouvelle classe

Code:

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
 
Ext.override(Ext.form.FormPanel, {//extjs 4 , remplacer Ext.form.FormPanel par Ext.form.Panel
 
    initComponentOld : Ext.form.FormPanel.prototype.initComponent,// version ext3
 
    initComponent: function(){
        this.on('afterrender', this.afterrender, this);
        this.initComponentOld();
        //this.callOverridden();// version ext4
    },
 
    /**
     * lance le formulaire à l'appuie sur entrée dans un textfield
     * Si un boutton de type submit est inclue, alors on simule le click en appellant la fonction handler
     * sinon on applique la méthode submit du formulaire 
     * !!! A faire si on veux applique aussi au combobox, list ect ...
     */
    afterrender : function(){
        var textFields = this.query('.textfield'),
        submitBt = this.query('button[type=submit]')[0],
        handler = submitBt && submitBt.handler;
        for(var i = 0, l = textFields.length; i <l; i++){
            var textField = textFields[i];
            textField.on('specialkey', function(el, e){
                 if(e.keyCode == e.ENTER){
                     if(handler)handler.call(submitBt.scope, submitBt, {})
                     else this.submit();
                 } 
            }, this);
        }
    }
})

Pour extjs4 et son systeme MVC, il suffit de remplacer keypress par specialkey

Code:

1
2
3
4
5
6
7
8
9
this.control({
    'users_loginform textfield' : {
        'specialkey' : function(){
            if(e.keyCode == e.ENTER){
            //lance le formulaire
            }
        }
    }
});

Ca pourra peux être aider, ou inspirer quelqu'un :ccool:
tchusss!