Проблема подкачки ExtJS с ArrayStore

Я пробую несколько вещей в ExtJS, включая отображение сетки с различными функциями.

На моей странице я сначала объявляю массив Javascript, содержащий около сотни данных, которые я сохраняю в переменной с именем myArray.

Затем я делаю следующее:

Ext.define('Fund2',{
extend:'Ext.data.Model',
fields:[{name:'Id'},
{name:'Id2'},
{name:'Name'},
{name:'Name2'},
{name:'Name3'},
{name:'Name4'},
{name:'Param1'},
{name:'Param2'},
{name:'Param3'}]
});

var myStore2=Ext.create('Ext.data.ArrayStore',{
model:'Fund2',
data:myArray,
pageSize:10
});

Ext.create('Ext.grid.Panel',{
renderTo:'div2',
store:myStore2,
height:500,
width:500,
columns:[{text:'Id',dataIndex:'Id'},
{text:'Name',dataIndex:'Name'},
{text:'Additional',dataIndex:'Param1'}],
dockedItems:[{
xtype: 'pagingtoolbar',
store:myStore2,
dock: 'bottom',
displayInfo: true
}]
});

На странице панель сетки отображается корректно и заполняется данными.

Панель инструментов подкачки также доступна и вычисляет нужное количество страниц.

Однако данные не "выгружаются"; все записи отображаются в сетке.

Знаете, где я ошибся?


extjs extjs4
person SRKX    schedule 19.08.2011    source источник
comment
Как вы разбиваете данные на страницы? Вы упомянули, что без разбиения на страницы отображаются все записи?   -  person Unknown    schedule 19.08.2011
comment
Согласно документации Sencha, вам не нужно делать ничего, кроме присоединения панели инструментов подкачки к хранилищу и установки pageSize для хранилища. (docs.sencha.com/ext-js/4-0 /#/направляющая/сетка)   -  person SRKX    schedule 19.08.2011

Ответы (2)


arrow_upward
2
arrow_downward

Добавь это:

myStore2.on('load', function(store, records, successful, operation) {
            this.loadData(myArray.slice((this.currentPage-1)*PAGE_SIZE, (this.currentPage)*PAGE_SIZE));
        },myStore2);

Полная версия:

Ext.onReady(function(){
    var myArray=[];
    for (var i=0; i<100; i++) {
        myArray[i] = ['Id_'+i,'Id2_'+i,'Name_'+i,'Name2_'+i,'Name3_'+i,'Name4_'+i,'Param1_'+i,'Param2_'+i,'Param3_'+i];
    }
    var PAGE_SIZE = 10;

    Ext.define('Fund2',{
        extend:'Ext.data.Model',
        fields:[{name:'Id'},{name:'Id2'},{name:'Name'},{name:'Name2'},{name:'Name3'},{name:'Name4'},{name:'Param1'},{name:'Param2'},{name:'Param3'}]});

    var myStore2=Ext.create('Ext.data.ArrayStore',{
        model:'Fund2',
        data:myArray,
        pageSize:PAGE_SIZE
    });

    myStore2.on('load', function(store, records, successful, operation) {
        this.loadData(myArray.slice((this.currentPage-1)*PAGE_SIZE, (this.currentPage)*PAGE_SIZE));
    },myStore2);

    myStore2.load();

    Ext.create('Ext.grid.Panel',{
        renderTo:Ext.getBody(),
        store:myStore2,
        height:500,
        width:500,
        columns:[{text:'Id',dataIndex:'Id'},
                 {text:'Name',dataIndex:'Name'},
                 {text:'Additional',dataIndex:'Param1'}],
        dockedItems:[{
            xtype: 'pagingtoolbar',
            store:myStore2,dock: 'bottom',
            displayInfo: true
        }]
    });
});
person Xupypr MV    schedule 19.08.2011

arrow_upward
0
arrow_downward

я решил аналогичную проблему, используя Ext .ux.data.PagingMemoryProxy

который работает довольно хорошо
учтите, что его нет в стандартной сборке ExtJS 4, вам нужно включить его вручную

person martyglaubitz    schedule 03.04.2012