Ext.ux.LiveGrid

[Ballsacian1]

Ext.grid.livegrid.CheckboxSelectionModel mouse and keyboard events called twice

How to Reproduce:
Load the Checkbox demo in the livegrid source and either click on a row or try moving up and down rows with the arrow keys. Moving up and down results in skipping a record each time and clicking with the mouse only allows certain actions to take place because mousedown and keyup are being called twice each time.

Problem:
Red text represents the problem and green text represents the added code to solve it.

Line 68 of Ext.grid.livegrid.CheckboxSelectionModel.js

initEvents : function()
    {   
        this.skipParentInitEvents = true;
        Ext.ux.grid.livegrid.CheckboxSelectionModel.superclass.initEvents.call(this);


        this.grid.view.on('reset', function(gridView, forceReload) {
                this.headerCheckbox = new Ext.Element(
                    gridView.getHeaderCell(this.grid.getColumnModel().getIndexById(this.id)).firstChild
                );
                if (this.markAll && forceReload === false) {
                    this.headerCheckbox.addClass('x-grid3-hd-checker-on');
                }
        }, this);


        Ext.grid.CheckboxSelectionModel.prototype.initEvents.call(this);
    },

and line 64 of Ext.grid.livegrid.RowSelectionModel.js

initEvents : function()
    {
        if(!this.skipParentInitEvents){
            Ext.ux.grid.livegrid.RowSelectionModel.superclass.initEvents.call(this);
        }


        var grid  = this.grid,
            view  = grid.view,
            store = grid.store;


        view.on('rowsinserted',    this.onAdd,            this);
        store.on('selectionsload', this.onSelectionsLoad, this);
        store.on('load',           this.onStoreLoad,      this);
    },

Because of these three superclass calls the Ext.ux.grid.livegrid.RowSelectionModel.superclass gets called twice resulting in Ext.grid.RowSelectionModel.initEvents being called twice and the mousedown and keyup events being doubled.

Solution:
By adding a flag for skipping the superclass initEvents, the CheckboxSelectionModel can still call both superclasses without worry of the double event hooks.

[ttbgwt]

Can you add a column locking feature to your live grid, or at least point me in the right direction to get something working? I purchased a developers license a few months ago.

Thanks!

[psm1963]

I've upgraded to 3.4 and have seen some strange behavior of live grid but only on IE....sometimes only ten rows populate in a grid and there is empty space where it should have added more visible row...any ideas...works fine in FF and Chrome

[wm003]

I've upgraded to 3.4 and have seen some strange behavior of live grid but only on IE....sometimes only ten rows populate in a grid and there is empty space where it should have added more visible row...any ideas...works fine in FF and Chrome

i had something similar and fixed it as follows:

    liveBufferUpdateFirstTime:true,
    // private
    liveBufferUpdate : function(records, options, success)
    {
        if (success === true) {
            this.adjustBufferInset();

            this.fireEvent('buffer', this, this.ds, this.rowIndex,
                Math.min(this.ds.totalLength, this.visibleRows-this.rowClipped),
                this.ds.totalLength,
                options
            );

            // this is needed since references to records which have been unloaded
            // get lost when the store gets loaded with new data.
            // from the store
            this.grid.selModel.replaceSelections(records);

            this.isBuffering    = false;
            this.isPrebuffering = false;
            this.showLoadMask(false);

            if (this.requestQueue >= 0) {
                var offset = this.requestQueue;
                this.requestQueue = -1;
                this.updateLiveRows(offset);
                return;
            }

            if (this.isInRange(this.rowIndex)) {
                this.replaceLiveRows(this.rowIndex, options.forceRepaint);
            } else {
                this.updateLiveRows(this.rowIndex);
            }
            if (this.liveBufferUpdateFirstTime) {
                this.liveBufferUpdateFirstTime=false;                
                this.layout();
            }
            return;
        } else {
            this.fireEvent('bufferfailure', this, this.ds, options);
        }

        this.requestQueue   = -1;
        this.isBuffering    = false;
        this.isPrebuffering = false;
        this.showLoadMask(false);

[DmitrySistor]

how to move the cursor to a specific record. for example, to move to the added record, knowing her number.

[wm003]

I've upgraded to 3.4 and have seen some strange behavior of live grid but only on IE....sometimes only ten rows populate in a grid and there is empty space where it should have added more visible row...any ideas...works fine in FF and Chrome

i seem to finally found that nasty bug. I happened when the livegrid tries to redraw the rows while its store is being loaded. Resulting in empty row-list which was used in Ext.fla resulting in a js error

My fix:

    processRows : function(startRow, skipStripe, paintSelections)
...
     if(rows.length>0){
        // add first/last-row classes
            if(cursor === 0){
                Ext.fly(rows[0]).addClass(this.firstRowCls);
            } else if (cursor + rows.length == this.ds.totalLength) {
                Ext.fly(rows[rows.length - 1]).addClass(this.lastRowCls);
            }
        }
    },

[ThorstenSuckow]

Hey there,

I have just released Ext.ux.Livegrid 0.8. This is a feature release which brings support for "stateful" livegrid components, i.e. restoring scroll position and selections of the recently loaded dataset.

As always, you can find the release over at the project's home page, http://www.ext-livegrid.com

[nosferatum]

Thorsten, does your Ext.ux.Livegrid 0.8 work with Ext 4?

[ThorstenSuckow]

Unfortunately, no support for ExtJS 4 yet. I have heard that ExtJS4 has a similiar implementation, but haven't worked with it yet, since in the projects I'm involved in do not use them. Have you made any experiences with it so far?

[nosferatum]

Well, actually ExtJs 4 has a built-in livegrid implementation, but it's completely ugly and weakly functional comparing to your nice Ext.ux.LiveGrid. It'd be awesome if you modified your LiveGrid for working under ExtJS 4.