1. #1
    Sencha User Fire-Dragon-DoL's Avatar
    Join Date
    Dec 2011
    Posts
    140
    Answers
    9
    Vote Rating
    1
    Fire-Dragon-DoL is on a distinguished road

      0  

    Default Answered: How to set a default value of flex for all columns of a grid panel

    Answered: How to set a default value of flex for all columns of a grid panel


    As the title states, I would like to set a default value for all columns as this comment suggest (in the documentation):

    Code:
    columns: {
        items: [
            {
                text: "Column A"
                dataIndex: "field_A"
            },{
                text: "Column B",
                dataIndex: "field_B"
            }, 
            ...
        ],
        defaults: {
            flex: 1
        }
    }

  2. The following code works well for me on Chrome, Ext 4.0.7. Column C & D will have flex set to 2 (default)
    Code:
    Ext.onReady(function(){
        var grid = Ext.create('Ext.grid.Panel', {
            renderTo: Ext.getBody(),
            width   : 800,
            height  : 150,
            columns: {
                items: [{
                    text: "Column A",
                    width: 140
                },{
                    text: "Column B",
                    flex: 1
                },{
                    text: "Column C",
                },{
                    text: "Column D",
                },{
                    text: "Column E",
                    flex: 3
                }],
                defaults: {
                    flex: 2
                }
            }
        });
        console.log(grid)
    });

  3. #2
    Sencha - Community Support Team
    Join Date
    Jan 2012
    Posts
    1,376
    Answers
    346
    Vote Rating
    113
    vietits is a name known to all vietits is a name known to all vietits is a name known to all vietits is a name known to all vietits is a name known to all vietits is a name known to all

      0  

    Default


    I think the way you do is correct.

  4. #3
    Sencha User Fire-Dragon-DoL's Avatar
    Join Date
    Dec 2011
    Posts
    140
    Answers
    9
    Vote Rating
    1
    Fire-Dragon-DoL is on a distinguished road

      0  

    Default


    I'm asking it because it's not working in that way, I have to write "flex: 1" on all columns

  5. #4
    Sencha - Community Support Team
    Join Date
    Jan 2012
    Posts
    1,376
    Answers
    346
    Vote Rating
    113
    vietits is a name known to all vietits is a name known to all vietits is a name known to all vietits is a name known to all vietits is a name known to all vietits is a name known to all

      0  

    Default


    The following code works well for me on Chrome, Ext 4.0.7. Column C & D will have flex set to 2 (default)
    Code:
    Ext.onReady(function(){
        var grid = Ext.create('Ext.grid.Panel', {
            renderTo: Ext.getBody(),
            width   : 800,
            height  : 150,
            columns: {
                items: [{
                    text: "Column A",
                    width: 140
                },{
                    text: "Column B",
                    flex: 1
                },{
                    text: "Column C",
                },{
                    text: "Column D",
                },{
                    text: "Column E",
                    flex: 3
                }],
                defaults: {
                    flex: 2
                }
            }
        });
        console.log(grid)
    });

  6. #5
    Sencha User Fire-Dragon-DoL's Avatar
    Join Date
    Dec 2011
    Posts
    140
    Answers
    9
    Vote Rating
    1
    Fire-Dragon-DoL is on a distinguished road

      0  

    Default


    I'm currently using this code:
    Code:
    Ext.apply(me, {
          items: [
          {
            xtype: 'gridpanel',
            region: 'center',
            forceFit: true,
            frame: false,
            padding: 1,
            columnLines: true,
            //features: [filterFeature],
            columns: {
              items: gridColumns,
              defaults: {
                flex: 1,
              }
            },
            
            tbar:
            {
              xtype: 'toolbar',
              region: 'north',
              items: [{
                xtype: 'button',
                text: 'Aggiungi'
              },{
                xtype: 'button',
                text: 'Rimuovi'
              }],
            },
          }],
        });
    Where "me" is a Ext.window.Window
    I tried but it's not working (is not the same behaviour of writing flex: 1 on each column). I also tried with header: 'randomtext' to see if all headers are set to the same name but it's not working

  7. #6
    Sencha - Community Support Team
    Join Date
    Jan 2012
    Posts
    1,376
    Answers
    346
    Vote Rating
    113
    vietits is a name known to all vietits is a name known to all vietits is a name known to all vietits is a name known to all vietits is a name known to all vietits is a name known to all

      0  

    Default


    I have tried to simulate your case and it still works.
    Code:
    Ext.onReady(function(){
        var gridColumns = [{
            text: "Column A",
            width: 140
        },{
            text: "Column B",
            flex: 1
        },{
            text: "Column C",
        },{
            text: "Column D",
        },{
            text: "Column E",
            flex: 3
        }];
        Ext.define('MyWindow', {
            extend: 'Ext.window.Window',
            initComponent: function(){
                var me = this;
                Ext.apply(me, {
                    items: [{
                        xtype: 'gridpanel',
                        region: 'center',
                        forceFit: true,
                        frame: false,
                        padding: 1,
                        columnLines: true,
                        //features: [filterFeature],
                        columns: {
                            items: gridColumns,
                            defaults: {
                                flex: 2,
                                header: 'abc'
                            }
                        },
                        tbar: {
                          xtype: 'toolbar',
                          region: 'north',
                          items: [{
                            xtype: 'button',
                            text: 'Aggiungi'
                          },{
                            xtype: 'button',
                            text: 'Rimuovi'
                          }]
                        }
                    }]
                });
                me.callParent(arguments);
            }
        })
        var win = Ext.create('MyWindow', {
            width: 800,
            height: 400,
            layout: 'fit'
        }); 
        win.show();
    });

  8. #7
    Sencha User Fire-Dragon-DoL's Avatar
    Join Date
    Dec 2011
    Posts
    140
    Answers
    9
    Vote Rating
    1
    Fire-Dragon-DoL is on a distinguished road

      0  

    Default


    I know it's mad but I tested your code and is correctly working, while mine not... i can't understand how this can happen while codes look the same.

    Maybe there is something wrong connected with using the MVC approach, I don't know

    EDIT: Ok seems I found the problem: if I set locked to false in any column, defaults are not applied.

    Why this mad thing?

  9. #8
    Sencha - Community Support Team
    Join Date
    Jan 2012
    Posts
    1,376
    Answers
    346
    Vote Rating
    113
    vietits is a name known to all vietits is a name known to all vietits is a name known to all vietits is a name known to all vietits is a name known to all vietits is a name known to all

      0  

    Default


    Lockable grid is in fact two grids created internally. The constructing phrase of these two grids will use only items config and ignore all other configs in columns: {defaults: {}, items: []} from the original grid config. The other way to say is that with lockable grid, the two following configs are the same:
    Code:
    columns: {
        defaults: {},
        ... //other configs
        items: [{...}]
    }
    Code:
    columns: [{...}]
    That's why you could not apply defaults setting for lockable grid.

  10. #9
    Sencha User Fire-Dragon-DoL's Avatar
    Join Date
    Dec 2011
    Posts
    140
    Answers
    9
    Vote Rating
    1
    Fire-Dragon-DoL is on a distinguished road

      0  

    Default


    Mh ok thanks a lot, I avoid to use lockable grid so.

Thread Participants: 1

Tags for this Thread

Turkiyenin en sevilen filmlerinin yer aldigi xnxx internet sitemiz olan ve porn sex tarzi bir site olan mobil porno izle sitemiz gercekten dillere destan bir durumda herkesin sevdigi bir site olarak tarihe gececege benziyor. Sitenin en belirgin ozelliklerinden birisi de Turkiyede gercekten kaliteli ve muntazam, duzenli porno izle siteleri olmamasidir. Bu yuzden iste. Ayrica en net goruntu kalitesine sahip adresinde yayinlanmaktadir. Mesela diğer sitelerimizden bahsedecek olursak, en iyi hd porno video arşivine sahip bir siteyiz. "The Best anal porn videos and slut anus, big asses movies set..."