Filtres multiples sur comboBox

**kanak09** · 28/11/2012, 12h40

Bonjour,
J'ai actuellement un comboBox extJs sur ma page qui load une liste de user en ajax ( résultat JSON) et ca fonctionne très bien.
J'ai voulu ensuite modifié le display pour que dans la liste déroulante de la combo box je vois afficher " pseudo : firstName lastName" puis quand je sélectionne, c'est bien le pseudo qui est pris en compte et ca fonctionne aussi !

Mon problème est que actuellement le filtre se fait sur le pseudo et je voudrais le faire sur plusieurs champ (pseudo firstname lastname).

Donc si dans ma liste j'ai "Toto : Pierre Durant" et bien je serai apte à le trouver aussi bien en commencant à taper toto, que pierre que durant. Sauf que actuellement il ne le trouve que si je tape toto...

Voici mon code actuel qui fonctionne :

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
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
 
Ext.require([
     'Ext.form.field.ComboBox',
     'Ext.form.FieldSet',
     'Ext.tip.QuickTipManager',
     'Ext.data.*'
 ]);
 
 Ext.onReady(function() {
     Ext.tip.QuickTipManager.init();
 
     // Define the model for a State
     Ext.define('User', {
         extend: 'Ext.data.Model',
         fields: [
             {type: 'string', name: 'id'},
             {type: 'string', name: 'firstName'},
             {type: 'string', name: 'lastName'},
             {type: 'string', name: 'matchingField'}
         ]
     });
 
 
 
 
    // ComboBox with a custom item template
    var customTplCombo = Ext.create('Ext.form.field.ComboBox', {
        renderTo: 'intranetUserName',
        typeAhead: true, 
        displayField: 'id',
        width: 250,
        store: { 
            autoLoad: true, 
            fields: ['id', 'firstName','lastName', 'matchingField'], 
            proxy: { 
                type: 'ajax', 
                url: '/admin/autocompleteUser.do'
            },
            filters:{
            	{property: "firstName"},
            	{property: "lastName"}
            }
        },
        queryMode: 'local',
 
        listConfig: {
            getInnerTpl: function() {
                return '<div>{id} : {firstName} {lastName}</div>';
            }
        },
        listeners:{
            'blur': checkValidUser,
            'select': checkValidUser
        } 
    });
});

Comme vous avez vu, j'ai essayé dans mon Store de rajouter les filters

Code :

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

1
2
3
4
5
6
 
            filters:{
            	{property: "id"},
            	{property: "firstName"},
            	{property: "lastName"}
            }

Mais ca n'a pas l'air d'être pris en compte.
Après les multiples posts que j'ai visité je n'ai pas trouvé quelqu'un cherchant le même comportement.

Merci pour l'aide.