Sélection d'un combo à l'intérieur d'un formPanel

Version imprimable

Rebonjour à tous !
Je cherche un moyen pour sélectionner un item d'un FormPanel plus précisément un combo pour l'effacer et le mettre à jour mais sans succès ...
A chaque fois j'ai cette réponse de fireBug :
this.comboSites is undefined http://192.168.4.214/www/Cartes/lib/js/script.js
Line 45

Je vous joint mon code :

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
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
 
var dataSites ;
var  dataEntreprises;
 
Ext.onReady(function(){
 
  function fct_submit(){}
 
        dataEntreprises = new Ext.data.JsonStore
        ({
                url: 'http://192.168.4.214/www/Cartes/fonctions.php?action=getEntreprises',
                 fields: ['nom']
        });      
        dataEntreprises.load();
 
        dataSites = new Ext.data.JsonStore
        ({
                url: 'http://192.168.4.214/www/Cartes/fonctions.php?action=getSites',
                 fields: ['site','nom']
        });
        dataSites.load();
 
  var form_recherche = new Ext.form.FormPanel({
        standardSubmit: true,
        items: [
                {        //Ici, on affiche à la suite tous les champs que l'on veut mettre
                        xtype: 'combo',
                        id : 'comboEntreprises', 
                        name : 'comboEntreprises', 
                        store: dataEntreprises,
                        displayField:'nom',
                        valueField:'nom',
                        typeAhead: true,
                        mode: 'local',
                        triggerAction: 'all',
                        emptyText:'Selectionner une entreprise ...',
                        selectOnFocus : true,
                        listeners:{
                                select:{
                                        fn:function() 
                                        {
                                                form_recherche.getComponent('comboSites').clearValue(); // Voici la ligne concernée
                                                form_recherche.getComponent('comboSites').store.filter('nom',form_recherche.getComponent('comboEntreprises').getValue());
                                         }
                                }
                        },
                        lastQuery:''
                },
                {
                        xtype: 'combo',
                        id : 'comboSites', 
                        name : 'comboSites', 
                        store: dataSites,
                        displayField:'site',
                        valueField:'site',
                        typeAhead: true,
                        mode: 'local',
                        triggerAction: 'all',
                        emptyText:'Selectionner un site ...',
                        selectOnFocus:true,
                        selectOnFocus : true
                },
                {
                        xtype: 'button',
                        text: 'Rechercher',
                        handler: fct_submit    //fonction à appeler lorsque l’on clique sur le bouton
                }
      ]
      });
        form_recherche.render('recherche');
 });

Ainsi la ligne qui cause l'erreur est la suivante :

Code:

1
2
 
 form_recherche.getComponent('comboSites').clearValue();

Ce ne dois pas être grad chose.
J'ai essayé avec les méthodes getCmp, getForm().getEl mais je dois avouer que je n'ai pas bien compris leure utilité.

Merci d'avance pour vos conseils toujours utils qui m'on bien aidé a progresser :ccool:

19/05/2009, 17h57
eric.pommereau

Comme ça je pense :

Code:

Ext.getCmp('comboSites').destroy();

Par contre n'as tu pas d'autre choix que de le détruire ?

Ensuite si tu veux mettre un autre comboBox, je pense que tu peux y parvenir avec la méthode insert() de ton FormPanel.

@+
20/05/2009, 11h59
titou624

non je voualsi faire un clearValue() pour vider le contenu effectievement ton code fonctionne ;) merci bien !

Bonjour,

J'ai le même cas de figure et je n'arrive pas à faire fonctionner votre solution.

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
33
34
35
36
37
38
39
40
41
42
43
44
45
46
 var combo = new Ext.form.ComboBox({
            id: 'comboxPerf',
            name:'comboxPerf',
            store: tableStore,
            displayField:'table',
            forceSelection: true,
            typeAhead: true,
            mode: 'local',
            triggerAction: 'all',
            emptyText:'Selection d\'une table...',
            selectOnFocus: true
        });
 
 
        var formPerf = new Ext.FormPanel({
            frame:true,
            title: 'Recherche des tables',
            defaultType: 'textfield',
            collapsible:true,
            items: [
                combo,
                {
                    xtype: 'button',
                    name: 'searchButton',
                    id: 'searchButton',
                    text: 'Chercher',
                    buttonAlign: 'right',
                    handler: function() {
                        boxValuejs = window.document.getElementById('comboxPerf').value;
 
                        store.load({params:{table: boxValuejs}});
                    }
                },{
                    xtype: 'button',
                    text: 'Sans filtre',
                    buttonAlign: 'right',
                    handler: function() {
                        Ext.getCmp('comboxPerf').destroy();
                        formPerf.insert('comboxPerf');
                        boxValuejs = ' ';
                        store.load();
 
                    }
                }
            ]
        });

ma combobox se détruit correctement mais elle ne se réinitialise pas après. En fait je souhaite que le bouton "sans filtre" remette la valeur de combobox à null ou mieux, la valeur de emptyText

Merci.

edit : j'en profite pour exposer un autre problème, est-ce normal que mes deux boutons ne soient pas aligné à droite ? Pourtant je précise bien buttonAlign: 'right',