Grid buffered/infinite scrolling in 4.1

Quote:

---

Originally Posted by Animal

:"> Yes, there's a recently introduced bug with variableRowHeight. I have a fix submitted which will be in the final 4.1

---

Hi Animal, regarding your post above. Is it fixed in 4.1 ? I still got that error in 4.1 final.
It works for the first time. But after refreshing the data few times, the error occurs:

Code:

---

Uncaught TypeError: Cannot call method 'getXY' of null ext-debug.js:15796
Element.override.getOffsetsTo ext-debug.js:15796
Ext.define.beforeViewRefresh extjs/src/grid/PagingScroller.js?_dc=1337087153401:204

---

Btw I refresh data using this code:

Code:

---

this.store.pageMap.clear();
this.store.loadPage(1);

---

Quote:

---

Originally Posted by Animal

There is no autoHeight or autoWidth config in Ext 4.1

There's no invalidateScrollerOnRefresh

There's no verticalScrollerType

To use buffered scrolling, you must give the grid a height, either by configuration or a layout of the container it is in.

Do not specify layout on a grid. It uses layout: 'fit' to fit the TableView inside it.

---

My grid is in the 'center' region of a border layout. I'm trying to migrate from 4.0.7 to 4.1.0 Final. The buffered scroll seems jerky and I'm facing the issue where the scroller is jumping up when I scroll down to the bottom of the grid.

I'm not using variable height rows but was still seeing the scrollbar bounce off the bottom of the range in Chrome. Setting variableRowHeight: true on verticalScroller fixed it, but I still wanted to know why that was needed with my fixed height rows. It turns out I had Chrome's Zoom set to 110%, and I'm sure that caused some rows to have heights a pixel or so taller than others. When I reset that to 100% I found I could remove the variableRowHeight setting and it still worked.

Hopefully this helps somebody as this was driving me nuts.

One of the prerequisites of infinite scrolling seems to be autoload: true. I have a lot of stores that are created at the start of my app but I'd prefer to be able to set the store loading later (When the matching grid is rendered) is there an easy way to "late-activate" a buffered store?

Quote:

---

Originally Posted by Curtis Fletcher

One of the prerequisites of infinite scrolling seems to be autoload: true. I have a lot of stores that are created at the start of my app but I'd prefer to be able to set the store loading later (When the matching grid is rendered) is there an easy way to "late-activate" a buffered store?

---

I've found that using autoload: false works fine with infinite scrolling. Just call store.loadPage(1) to initiate loading later.

Quote:

---

Originally Posted by JohnnyHK

I've found that using autoload: false works fine with infinite scrolling. Just call store.loadPage(1) to initiate loading later.

---

Thanks, I had tried that to no avail but it was probably on an earlier beta, apologies for not checking on RC3

Can someone explain to me the relationship between the leading and trailing buffer configuration for the store backing the grid, and the same buffer configuration on the paging scroller?

Does buffered scrolling support local sorting now? We enabled buffered grid with local sort, everytime we scroll down the grid is automatically sorted by the first column of the grid, even if we sort the grid by some other column before the scroll.

Quote:

---

Originally Posted by shmeltex

What should be the recommended approach to handle passing extra parameters with load/loadPage for buffered store? If I do

Code:

---

store.loadPage(1, {params:{ something: 'else' }})

---

something=else passed to server only with the request for the first page, all requests for subsequent pages will not have something=else set.
Is setting extraParams on proxy the only answer?

---

I miss if there's an answer to this post...

I've this problem with infinite scrolling, store:

PHP Code:

---

Ext.define('Pt.store.StorePianiInfinite', {
    extend: 'Ext.data.Store',

    requires: [
        'Pt.model.ModelPianiTerapeutici'
    ],

    constructor: function(cfg) {
        var me = this;
        cfg = cfg || {};
        me.callParent([Ext.apply({
            storeId: 'StoreInfinite',
            model: 'Pt.model.ModelPianiTerapeutici',
            buffered: true,
            clearOnPageLoad: false,
            leadingBufferZone: 300,
            pageSize: 100,
            remoteGroup: true,
            proxy: {
                type: 'ajax',
                simpleGroupMode: true,
                groupDirectionParam: 'dir',
                simpleSortMode: true,
                url: 'php/xy.php',
                reader: {
                    type: 'json',
                    idProperty: 'id',
                    messageProperty: 'msg',
                    root: 'piani'
                }
            },
            sorters: {
                direction: 'DESC',
                property: 'id'
            }
        }, cfg)]);
    }
}); 


---

Store listener to add extra params with request:

PHP Code:

---

me.getStorePianiInfiniteStore().on({

    beforeload: function (store, operation, opts) {

        Ext.apply(operation, {
            params: {
                numero: me.getNPiano().getRawValue(),
                dt1: Ext.Date.format(me.getDataDa().getValue(),'Ymd'),
                dt2: Ext.Date.format(me.getDataA().getValue(),'Ymd'),
                dt3: Ext.Date.format(me.getDataVDa().getValue(),'Ymd'),
                dt4: Ext.Date.format(me.getDataVA().getValue(),'Ymd'),
                specialita: me.getCbSpecialita().getValue(),
                principio: me.getCbPrincipi().getValue(),
                medico: me.getCbMedico().getValue(),
                paziente: me.getCbPaziente().getValue(),
                stato: me.getCbStato().getValue()
            }
        });
    } 


---

But in Firebug I see only the first request with all params i need

Attachment 42220

For page 2, 3...

Attachment 42221

How to fix it?

Quote:

---

Originally Posted by filippo.ferrari

How to fix it?

---

Looks like the only way to handle it is by using

Code:

---

store.getProxy().extraParams...

---