Why does grid scroll if no selection?

[jeotte]

I'm having an issue where I have selected a row, but when a column is hidden or made visible, the grid scrolls to the top. It's very frustrating and seems to happen when 'setVisible' is called (also, I'm working with extjs version 4.2.2). Unfortunately, I can't seem to reproduce this exactly in Fiddle. The closest I've come to reproducing it is: the grid scrolls when a column is hidden/displayed and there is no selection.

Here is my fiddle: https://fiddle.sencha.com/#fiddle/1hg5

Basically, I have a checkbox that when you check it will hide Column1; unchecking it will unhide Column1. When the 'Framework' is set to 4.2.1.883, if I scroll down and check the checkbox for the last item in the grid, the grid automatically scrolls to the top. However, if I had 'selected' that row, and then clicked the checkbox, the grid doesn't scroll to the top.

Additionally, when I test this with Framework set to '5.0.0.736', selecting the checkbox without selecting the row does *not* cause the grid to scroll (the desired behavior).

Can someone explain what is going on? Why does the grid scroll at all in 4.2.1.883? What changed between that version and 5.0.0.736 to cause the behavior to be different?

I'd appreciate any input on this.

Again, my *real* issue is that at my work we're using 4.2.2, and I have a grid that when a column is hidden/shown programmatically by calling setVisible, the grid scrolls to the top even when I have an item selected. I tried adding 'suspendLayouts' and 'resumeLayouts' before and after the call to setVisible, but it didn't help. Any ideas on this issue would be greatly appreciated too, but since I can't yet reproduce it exactly in Fiddle, I know I must be doing something wrong in my code.

Thanks!

[Gary Schlosberg]

Are you changing your data as well or simply toggling a column?

[jeotte]

Simply toggling the visibility of columns.


After some debugging today, what I'm finding is that calling setVisible eventually calls Ext.view.AbstractView.refresh(), and in there, even if 'preserveScrollOnRefresh' is set to true, it clears out and seems to reload my grid. But, I'm not sure if the problem is there, or if it's in 'refreshSelection()', which gets called at the end of the Ext.view.Table.refresh() method.

Below is the Ext.view.Table.refresh method and refreshSelection. The me.callParent(arguments) calls the Ext.view.AbstractView.refresh method.

    refresh:function(){        var me = this;

        me.callParent(arguments);
        me.headerCt.setSortState();

        // Create horizontal stretcher element if no records in view and there is overflow of the header container.
        // Element will be transient and destroyed by the next refresh.
        if (me.el && me.headerCt && !me.ownerCt.hideHeaders && me.headerCt.tooNarrow && !me.all.getCount()) {
            me.el.createChild({
                role: 'presentation',
                style:'position:absolute;height:1px;width:1px;left:' + (me.headerCt.getTableWidth() - 1) + 'px'
            });
        }

        me.refreshSelection();
    },

    refreshSelection: function() {
        var me = this,
            selModel = me.selModel,
            selected, len, i;

        if (selModel.isRowModel) {
            selected = selModel.selected.items;
            len = selected.length;
            for (i = 0; i < len; i++) {
                me.onRowSelect(me.indexOf(me.getNode(selected[i])));
            }
        }
        me.selModel.onLastFocusChanged(null, me.selModel.lastFocused, true); },