Discussion :

[Bruno13]

Bonjour à tous,

J'ai un problème avec l'affichage d'un rowexpander dans un Grid.
Je ne comprends pas pourquoi j'ai ce problème?!
La première ligne s'affiche bien (enfin presque puisqu'il y a le + sur 2 lignes et l'expand ne fonctionne pas non plus ) et ensuite c'est la cata tout est décalé dans les colonnes!



Mon fichier JSON:

Code :

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

Ext.data.JsonP.callback1({"success":true,"total":30,"rows":[{"pn":"CN101700810B","pd":"2013-03-13T23:59:59Z","tien":["Boeing and Airbus aircraft audio management unit test adapter"]},{"pn":"CN202574632U","pd":"2012-12-05T23:59:59Z","tien":["Mobile maintenance and testing platform for airbus series aircraft driver seat"]},{"pn":"CN202270361U","pd":"2012-06-13T23:59:59Z","tien":["Aeromodel of airbus"]},{"pn":"CN202225867U","pd":"2012-05-23T23:59:59Z","tien":["Airbus"]}.........]});

Mon store est tout simple:

Code :

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

1
2
3
4
5
Ext.define('PP.store.pxxxx.Pxxxxs', {
    extend:     'Ext.data.Store',
    model:      'PP.model.pxxxx.Pxxxx',
    autoLoad:   false
});

Mon Model:

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
Ext.define('PP.model.pxxxx.Pxxxx', {
    extend:     'Ext.data.Model',
    fields: [
        // Données de base
        {name: 'pn',    type: 'string'},
        {name: 'fid',   type: 'string'},
        {name: 'pd',    type: 'date', convert:function(v,record) { return Ext.Date.format(new Date(v), 'Y-m-d'); }},
 
        {name: 'tien',  type: 'string'},
    ],
    proxy: {
        type:   'jsonp',
        url:    'http://xxxxx/pp/search.php',
 
        reader: {
            type:           'json',
            totalProperty:  'total',
            root:           'rows'
        }
 
    },
    sorters: [{
        property:  'pd',
        direction: 'DESC'
    }]    
   });

Je récupère bien le totalProperty, et les autres valeurs, bref j'avoue que je sèche alors si vous avez une idée je suis preneur !
En attendant je continue mon investigation....

ah oui et voici ma vue!

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
57
58
59
60
61
62
63
64
65
66
67
68
69
70
Ext.define('PP.view.patent.MyPGrid', {
    extend: 'Ext.grid.Panel',
    alias:  'widget.mypgrid',
 
    id:     'mypgrid',
    xtype:  'row-expander-grid',
    region: 'center',
    border: false,
    //padding:        '1 1 1 1',
 
    initComponent: function() {
        var me = this;
        Ext.applyIf(me, {
            store: 'PP.store.pxxxx.Pxxxxs',                  
            loadMask: true,
            columnLines: true,
            enableLocking: true,
            dockedItems: [{
                            xtype: 'toolbar',
                            dock: 'bottom',
                            items: [
                                    {
                                        xtype : 'button',
                                        text: 'Expand all Rows',
                                        action: 'expand'
                                    },
                                    {
                                        xtype: 'tbseparator'
                                    },
                                    {
                                        xtype : 'button',
                                        text: 'Collapse all Rows',
                                        action: 'collapse'
                                    }
                                    ]
                            }],
            plugins: [{
                        ptype: 'rowexpander',
 
                        rowBodyTpl : new Ext.XTemplate(
                            '<p><b>PN:</b> {pn}</p>',
                            '<p><b>Abstract:</b> {tien}</p>'
                        )//,
 
                        //expandOnRender: true,
                        //expandOnDblClick: false
            }],
            //collapsible: true,
            //animCollapse: false,
            //title: 'Expander Rows in a Collapsible Grid with lockable columns',
            //iconCls: 'icon-grid',
            margin: '0 0 20 0',
 
            columns: [
                {
                    header:       'PN',
                    dataIndex:  'pn'
                },{
                    header:       'Title',
                    flex:       1,
                    dataIndex:  'tien'
                },{
                    header:       'Pud. Date',
                    dataIndex:  'pd'
                }
            ]
        });
        me.callParent(arguments);
    }
});