2013-11-04 64 views
4

我想爲通過Web服務接收數據的網格面板進行客戶端分頁,但我不知道如何繼續此操作。ExtJS 4.2網格分頁

這是我的代碼到目前爲止。分頁工具欄顯示正確的頁數,但是,所有結果都顯示在第一頁。往前走,回到頁面沒有任何區別。

型號

Ext.define('MCS.model.task.myModel', { 
extend: 'Ext.data.Model', 
fields: 
[ 
    { name: 'Case_ID', type : 'Auto' }, 
    { name: 'BP_Name', type : 'Auto' }, 
    { name: 'Project', type : 'Auto' } 
], 

proxy: 
{ 
    type: 'ajax', 
    url: '/Service/Task?type=mytasks', 
    reader: 
    { 
     type: 'json', 
     root: 'data' 
    }, 
}, 
}); 

商店

Ext.define('MCS.store.task.myStore', { 
extend: 'Ext.data.Store', 
requires: 'MCS.model.task.myModel', 
model: 'MCS.model.task.myModel', 

pageSize : 10, 

autoLoad: true 
}); 

的GridPanel

Ext.define('MCS.view.task.myGrid', { 
extend: 'Ext.grid.Panel', 
alias: 'widget.myGrid', 

store: 'task.myStore', 
columns: [], 

dockedItems: 
[ 
    { xtype: 'myToolbar', 
     dock: 'top', 
    }, 
    { xtype: 'pagingtoolbar', 
     dock: 'bottom', 
     displayMsg: '{0} - {1} of {2}', 
     emptyMsg: 'No data to display', 
     store: 'task.myStore' 
    } 
], 

initComponent: function() 
{ 
    this.columns = 
    [ 
     { text: 'Case ID', dataIndex: 'Case_ID' }, 
     { text: 'Business Partner Name', dataIndex: 'BP_Name' }, 
     { text: 'Project', dataIndex: 'Project' } 
    ]; 

    this.callParent(); 
} 
}); 
+0

這可能會幫助你解決這個問題。請參閱接受的答案。 http://stackoverflow.com/questions/42650224/pagesize-not-working-on-grid-in-extjs – 2017-03-13 09:56:06

回答

0

我沒有與尋呼本地數據的個人經驗,但對於分頁工具欄的分機文檔有一些信息和鏈接你可能會覺得有用。

http://docs.sencha.com/extjs/4.2.0/#!/api/Ext.toolbar.Paging

搜索頁面的「傳呼與本地數據」找我指的部分。在該部分下方是評論鏈接。點擊它展開評論並閱讀這些評論。

我希望這有些幫助。祝你好運!

0
Ext.define('Crm.store.Companies', { 
    extend: 'Ext.data.Store', 
    requires: 'Crm.model.Company', 
    model: 'Crm.model.Company', 
    autoLoad: {start: 0, limit: 5}, 
    pageSize: 5, 
    remoteSort: true, 
    sorters: [{ 
       property : 'name', 
       direction: 'asc' 
      }], 
    proxy: { 
    type: 'rest', 
    url : 'service/companyList/json', 
    reader: { 
     type: 'json', 
     root: 'companyList', 
     totalProperty: 'total' 
    } 
    } 
}); 
-1

Code Link

Ext.define('School.model.Student', 
{ 
    extend : 'Ext.data.Model', 
    idProperty : 'Id', 
    fields: [ 
     { name: 'Id', type: 'int', defaultValue: 0 }, 
     { name: 'firstName', type: 'string' }, 
     { name: 'middleName', type: 'string' }, 
     { name: 'lastName', type: 'string' }, 
     { name: 'birthDate', type: 'date' }, 
     { name: 'address1', type: 'string' }, 
     { name: 'address2', type: 'string' }, 
     { name: 'city', type: 'string' }, 
     { name: 'state', type: 'string' } 
    ], 
    validations : [{ 
     type : 'presence', 
     field : 'firstName' 
    }], 
    proxy : 
    { 
     type : 'ajax', 

     api : 
     { 
      read: '/ExampleService.svc/studentswithpaging/' 
     }, 
     reader : 
     { 
      type : 'json', 
      root : 'Students', 
      totalProperty : 'TotalCount' 
     } 

    } 
}); 
0

嗯,這可能有點晚,但始終確保你正在處理在服務器端分頁,分頁工具欄將發送一個開始和限制參數,以你的腳本;因此您的腳本必須確保它基於這些參數提取數據。

<?php 
    $start = $_GET['start']; 
    $limit = $_GET['limit']; 
    $sql = "SELECT * FROM table limit $start,$limit; 
?>