PDA

View Full Version : Display pagination bar in next line in bbar



evs.saad
21 Dec 2012, 7:09 AM
Hi,
I have a grid in which I have some buttons and it is occupying the whole bottom panel. Now I want to display pagination in the same bar but in the next line so the design don't get disturbed. Here is my code for the bbar

bbar:[pagingbar,
'-',{
text: 'Add',
iconCls: 'icon-add',
handler: function(){
editMoreData(0);
}
},
'-', {
text: 'Search',
iconCls: 'icon-search',
handler: function(){
displaySearchFilter(origid);
}
},

'-',{
text: 'Sign Orders',
iconCls: 'icon-warning',
handler: function(){
displayOrderSignForm();
}
},
'-',{
text: 'Send For Review',
iconCls: 'icon-warning',
handler: function(){
displayOrderReviewForm();
}
},
'-',{
text: 'Cancel',
iconCls: 'icon-delete',
handler: function(){
cancelOrders();
}
},


'-', {
text: 'Refresh',
iconCls: 'icon-table_refresh',
handler: function(){
Ext.getCmp('orderGridPanel').stopEditing(false);
var rs = orderGridPanel.store.getModifiedRecords();
if (rs.length > 0) {
var status = window.confirm("Some data modified on grid, do you want to save grid data before loading latest data ?");
if (status){
orderGridPanel.store.save();
}
}
orderGridPanel.store.load();
}
},
'-', {
text: 'Print',
iconCls: 'icon-print',
handler: function(){
statusStr = getHistGridSelection();

}
}
,'->',
'Display:','-',
{
xtype: 'radio',
name: 'search_filter',
id:'search_filter_1',
inputValue: 1,
boxLabel: 'Open Orders',
handler: onChangeLoadFilter ,
checked : true,
width:100,
align:'left'
},'-',{
xtype: 'radio',
name: 'search_filter',
id:'search_filter_2',
inputValue: 2,
boxLabel: 'All Orders',
handler: onChangeLoadFilter,
width:80,
align:'left'
},'-',{
xtype: 'radio',
name: 'search_filter',
id:'search_filter_3',
inputValue: 3,
boxLabel: 'Orders 5 days back',
handler: onChangeLoadFilter,
width:115,
align:'left'
}
,'-',{
xtype: 'radio',
name: 'search_filter',
id:'search_filter_4',
inputValue: 4,
boxLabel: 'Cancelled Orders',
handler: onChangeLoadFilter,
width:100,
align:'left'
}



]
Thanks in advance

mitchellsimoens
22 Dec 2012, 8:47 PM
I'm not sure I know what you mean by next line.

What you need is


bbar : [
pagingtoolbar,
{
items : [
//buttons here
]
}
]

evs.saad
24 Dec 2012, 4:30 AM
Basically I want is that I want to show all the icons in one line and in the next line the pagination bar. It will be something like this
Add , Edit, Delete, etc Sort: All, Open ,etc
Pagination bar here in the next line.
I cannot display the pagination bar and the icons on the same line as I cannot adjust my icons with the paging bar. So I need to shift my paging bar to next line so everything can adjust.
Thanks for your reply