Ich möchte implementieren, d. H. Onclick (toggeln) der Schaltfläche, Raster sollte gesamte Daten in einzelne Seite laden und onclick (toggeln) der Schaltfläche implementieren Paging (d. H. Seitengröße von 25). Wie können wir diese Funktionalität erreichen? Vielen Dank im VorausAuf Umschalten der Schaltfläche implementieren Paging und entfernen Paging EXTJS
Hier ist der Code, der nicht funktioniert. Müssen Änderungen vorgenommen werden? Dies ist Store:
var Store = Ext.create('Ext.data.Store', {
remoteSort : true,
autoSave: false,
fields: data,
pageSize: 20,
remoteFilter:true,
sortInfo:{field: 'ORDER_ID', direction: "DESC"},
proxy: {
type: 'ajax',
url : url,
reader: {
type: 'json',
rootProperty: 'data',
totalProperty: 'total'
}
},
listeners: {
load : function(store, records, options) {
//index = options.params.start; // need to work here to get index
if (store.getCount() == 0) {
Ext.Msg.alert("No View Sales History Data Loaded", "please clear current filter(s)"); // <-- show load-feedback for suceess conditions
} else {
Ext.Msg.alert("View Sales History Data Loaded", "" + store.getCount() + " of " + store.getTotalCount() + " record(s)");
}
if (pagingtoolBar.pageSize != maxPageSize) {
Ext.getCmp('pageSizeMaxButton').show();
Ext.getCmp('pageSizeMinButton').hide();
}
if (window.top && window.top.footer) window.top.footer.ResetTimer();
},
exception : function(proxy, type, action, options, res) {
progressWindow.hide();
}
}
}
Hier wird die Paging-Toolbar ist:
{
text: 'Multi Page', //toggle button in toolbar
tooltip: 'Switch to single-page view',
iconCls: 'silk-pageSize',
id: 'pageSizeMaxButton',
hidden: false,
handler: function() {
if (viewSalesHistoryWindow != undefined) viewSalesHistoryWindow.close();
pagingtoolbar.pageSize = maxPageSize;
Ext.getCmp('pageSizeMinButton').show();
this.hide();
//pagingtoolbar.changePage(1);
//pagingtoolbar.change; // changePAge is not available in Extjs6
//filters.local = true;
vshStore.remoteSort = false;
},
{
text: 'Single Page',// toggle button in toolbar
tooltip: 'Switch to multi-page view',
iconCls: 'silk-pageSize',
id: 'pageSizeMinButton',
hidden: true,
handler: function() {
if (viewSalesHistoryWindow != undefined) viewSalesHistoryWindow.close();
// set page size
pagingtoolbar.pageSize = originalPageSize;
// toggle buttons
Ext.getCmp('pageSizeMaxButton').show();
this.hide();
// switch to page 1
//pagingtoolbar.changePage(1);
//pagingtoolbar.change; // changePAge is not available in Extjs6
//filters.local = false;
vshStore.remoteSort = true;
}
}