1. #1
    Sencha User
    Join Date
    Jul 2008
    Posts
    80
    Vote Rating
    0
    ajmPal is on a distinguished road

      0  

    Default GridPanel autoWidth

    GridPanel autoWidth


    I would like to setup my GridPanel so that it expands, depending on the size of the browser (FireFox).
    I've tried
    Code:
    autoWidth: true
    or
    Code:
    width: '100%'
    or
    Code:
    viewConfig: {
      forceFit: true
    }
    But none work
    Any suggestions ?
    I would also like to do it for a TabPanel

    I am using
    Code:
    layout: 'fit'
    Tony Mariella

  2. #2
    Sencha - Support Team scottmartin's Avatar
    Join Date
    Jul 2010
    Location
    Houston, Tx
    Posts
    9,000
    Vote Rating
    456
    scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future

      0  

    Default


    You can use:

    Code:
    forceFit = true;
    autoExpandColumn = 'fieldname'; // column to grow on resize
    Regards,
    Scott.

  3. #3
    Sencha User
    Join Date
    Jul 2008
    Posts
    80
    Vote Rating
    0
    ajmPal is on a distinguished road

      0  

    Default


    What I really want is to build a grid with a scrollbar at the bottom. The scrollbar will shrink/grow depending on the size of the browser window. All the columns have a fixed width.

  4. #4
    Sencha - Community Support Team sword-it's Avatar
    Join Date
    May 2012
    Location
    Istanbul
    Posts
    1,333
    Vote Rating
    85
    sword-it is a jewel in the rough sword-it is a jewel in the rough sword-it is a jewel in the rough sword-it is a jewel in the rough

      0  

    Default put your grid under Viewport

    put your grid under Viewport


    hi ajmpl,


    If you want to resize your grid according browser size, You can put your grid under Ext.Viewport({..})
    For example
    Code:
    new Ext.Viewport({
       layout:'border',
       items:[
          {
             xtype:'yourgrid'
             region:'center',
           }
       ]
    })
    For more information see http://docs.sencha.com/ext-js/3-4/#!/api/Ext.Viewport
    sword-it.com, Sencha Developer House in Turkey - Istanbul University Technopark Suite 204.

  5. #5
    Sencha User
    Join Date
    Jul 2008
    Posts
    80
    Vote Rating
    0
    ajmPal is on a distinguished road

      0  

    Default


    What do you use for 'yourgrid' ?
    Where the grid is rendered to ?
    If I have a grid:
    Code:
    grid = new Ext.grid.GridPanel({
     store: store,
     columns: [...],
     renderTo: 'combinedTable',
    id: 'combinedGrid',
    height: 300,
    ...
    How do you include the GridPanel in the Viewport ?

  6. #6
    Sencha - Community Support Team sword-it's Avatar
    Join Date
    May 2012
    Location
    Istanbul
    Posts
    1,333
    Vote Rating
    85
    sword-it is a jewel in the rough sword-it is a jewel in the rough sword-it is a jewel in the rough sword-it is a jewel in the rough

      0  

    Default


    In your case grid take a reference for gridPanel so you can use like this

    Code:
      new Ext.ViewPort({
         layout:'fit',
         items: grid   //  this will refer to your gridPanel
      })
    sword-it.com, Sencha Developer House in Turkey - Istanbul University Technopark Suite 204.

Thread Participants: 2

Tags for this Thread