PDA

View Full Version : how to fix the paging toolbar at the bottom of the panel



arunkumargm1987
11 Jul 2010, 9:46 PM
panel = new Ext.Panel(
{
renderTo :'search-panel',
border :false,
layout :'anchor',
bodyStyle :'padding:5px',
autoScroll :true,
height:'100%',
anchor :'100%',
items [
new Ext.DataView(
{
tpl : resultTpl,
store : ds,
itemSelector : 'div.search-item',
deferEmptyText : false,
emptyText : '<div style="vertical-align:middle;color:red"></br></br>&nbsp;&nbsp;No results found</div>'
}),
new Ext.DataView(
{
tpl : suggestiontpl,
Store : ds1,
itemSelector : 'div.search-suggestion',
anchor:'100%'
}) ],
bbar : new Ext.PagingToolbar( {
store : ds,
pageSize : 4,
displayInfo : true,
displayMsg : 'Topics {0} - {1} of {2}',
emptyMsg : "No topics to display"
})
});
this is my code, and my paging tool bar is getting displayed just below the search results , how can i display it at a fixed place in the panel say at the bottom of the panel,
please help me out how can i do that..:(

Condor
11 Jul 2010, 10:10 PM
It should be at the bottom of the panel!

But you can't configure a panel with height:'100%' (it needs to be a number!).

Is this panel part of another Ext container? In that case you should configure the layout so the panel gets the correct height.

If the panel is rendered to legacy HTML markup then you'll want to use the FitToParent plugin to get the panel to take the height of the 'search-panel' element.