PDA

View Full Version : Grid scrollbar not shown



nicosk
10 Dec 2011, 5:11 AM
id: 'card-1',
border: false,
items: [{
xtype: 'panel',
layout: 'hbox',
border: false,
frame: true,
items: [{
xtype: 'grid',
autoScroll: true,
selModel: csm,
title: 'Contacts',
width: 500,
store: contactStore,
columns: [{
text : 'Id',
flex : 1,
hidden : true,
dataIndex: 'id'
}, {
text : 'First Name',
flex : 1,
sortable : true,
dataIndex: 'firstName'
}, {
text : 'Last Name',
flex : 1,
sortable : true,
dataIndex: 'lastName'
}, {
text : 'Phone #',
flex : 1,
sortable : true,
dataIndex: 'phone'
}],
}, {
xtype: 'panel',
title: 'Groups',
width: 300,
height: 400,
padding : '10px'
}]
}]
}

I cannot get the vertical scrollBar to show. autoScroll in grid and scroll: true don't work

Any ideas?

vadimv
10 Dec 2011, 7:04 AM
probably you could try to play too with: viewConfig:{autoScroll:true} which is browsers native scroll in viewbody, or with the parent layout, or height/maxHeight. If none of the combinations doesn't work then could be the known bugs with the scrolls which many users are encountering in 4.0.7 . Is being said that this is fixed in 4.1

aharley40
10 Dec 2011, 1:07 PM
Try verticalScrollerType:'paginggridscroller' as another grid config

skirtle
11 Dec 2011, 5:19 AM
There are some issues with your layout. You're using an hbox, so you can't rely on auto-sizing based on the children. You also shouldn't rely on grids to auto-size.

Without seeing the rest of your code I can't give you a definitive answer about what your layout should be. The key thing to understand is that parent containers are responsible for determining the sizes of their children, not the other way round.

The main problem is that your grid doesn't have a height set. You can either set a fixed height in pixels or stretch it to fit the container using the align setting on the layout:


layout: {
align: 'stretch',
type: 'hbox'
}

You'll also need to make some changes to the container to set its height.