PDA

View Full Version : Hide grid scroll bars and use browsers scroll bars in Ext JS4.1.1gird



paragdreams
12 Dec 2012, 4:22 AM
Hi All,

I am working on to improve our old listing screen to new grid view listing screen.
Our old listing screen uses HTML table and if number of columns are increased the browsers horizontal scroll bar is used to see last columns in listing screen.

With Extjs 4.1.1 using grid panel I am not able to hide scroll bars and set grid width as per number column width and allow to scroll grid data using browser scroll bar.
Is there any way to implement this? Your help will highly appreciated.

Below is my code for grid panel,

grid = Ext.create('Ext.grid.Panel', {
store: getLocalStore(),
selModel: sm,
columns: columnHeaders,
columnLines: true,
//width: myWidth,
//minHeight : myHeight,
//maxHeight : myHeight,
//height: myHeight,
stripeRows: true,
cls: 'gridview-css',
viewConfig: {
emptyText : '<div style="text-align:center;font-size: 11px; font-family: verdana, arial, sans-serif;">No Records Found.</div>',
deferEmptyText : false
},
listeners:{
'beforerender': function(g) {
mask.show();
},
viewready: function(view) {
mask.hide();
}

}
});

Thanking you in advance.

-Parag

mitchellsimoens
14 Dec 2012, 6:02 AM
When you say use the browser's scrollbar, are you meaning the scrollbar in the total viewport and not in the grid via auto height?