Results 1 to 8 of 8

Thread: Grid Scrollbars in IE

  1. #1

    Default Grid Scrollbars in IE

    Hi Everyone,

    Today I wasted lot of time in setting up scrollbar for a grid panel inside a tab panel. The grid should get a scroll bar if the columns total width in the grid exceeds the tab's width. I have configured the grid with forceFit:false so that columns would be arranged by their width specified. This works well with FF but not in IE. I don't see the scroll bar in IE and I could see only few columns in the grid.

    I have already set autoScroll : true to the tab because setting grid's autoScroll property doesnt have any effect.

    Could anyone help me.

  2. #2
    Ext User zhegwood's Avatar
    Join Date
    Dec 2007
    Location
    Boulder, CO Suburbia (Lafayette)
    Posts
    388

    Default

    If you could post your code, it would be helpful, but I'm surprised that autoScroll isn't working. I'm guessing the x-panel-body class is what you want to set to scroll in this case (overflow:auto).

  3. #3

    Default

    Hi , thanks for the quick response.
    unfortunately I am working remotely and I cant post the code right now.
    you are right ,x-panel-body is the css class

    I tried to setup the overflow property of dom style

    grid.getView().el.dom.style.overflowX='auto';
    grid.getView().el.dom.style.overflowY='auto';

    but no luck.

  4. #4
    Ext User zhegwood's Avatar
    Join Date
    Dec 2007
    Location
    Boulder, CO Suburbia (Lafayette)
    Posts
    388

    Default

    Quote Originally Posted by Nagadev View Post
    Hi , thanks for the quick response.
    unfortunately I am working remotely and I cant post the code right now.
    you are right ,x-panel-body is the css class

    I tried to setup the overflow property of dom style

    grid.getView().el.dom.style.overflowX='auto';
    grid.getView().el.dom.style.overflowY='auto';

    but no luck.
    overflow-x and overflow-y don't work across browsers. Only the "overflow" property does. If you only want a horizontal scrollbar and no vertical scrollbar, set the scrolling container about 20px taller than the grid and that might do it.

  5. #5
    Sencha User Condor's Avatar
    Join Date
    Mar 2007
    Location
    The Netherlands
    Posts
    24,245

    Default

    Do not set a grid to autoScroll:true, a grid manages scrolling itself.

    Do not set a grid to autoHeight:true, because it will kill both horizontal and vertical scroll.

    How did you include the grid in the tabpanel? I'm almost certain that you overnested and didn't specify a layout on the extra panel.

  6. #6

    Default

    Still its not working in IE. It works good in firefox.

    my grid is a part of a tabpanel's tab like this.
    Code:
    vat tabpanel = new Ext.TabPanel({
    
    autoWidth:true, height:700, items:[{
    title:'search', layout:'form', items:[searchForm,searchGrid]
    }]
    });
    this tabpanel is a part of viewport's west panel.

  7. #7
    Sencha User Condor's Avatar
    Join Date
    Mar 2007
    Location
    The Netherlands
    Posts
    24,245

    Default

    layout:'form' is a bit unusual choice to put 2 panels below each other (border or vbox are much more common).

  8. #8

    Default

    Hi Condor, Thanks for your help..
    Finally I found that the problem is not with Ext Js, Problem is at server end and I could fix it.

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •