1. #1
    Ext User
    Join Date
    Jun 2007
    Location
    Washington, D.C.
    Posts
    29
    Vote Rating
    0
    mike000 is on a distinguished road

      0  

    Default My Fix To Some Scroll Bugs With Locked Columns in a Grid

    My Fix To Some Scroll Bugs With Locked Columns in a Grid


    I searched a little bit, but not extensively for the two bugs I was having with scrolling issues with locked columns in a grid. As far as I can tell these bugs still exist in the latest stable release candidate.

    The first bug was the screen would not scroll right with the selected cell if you were navigating using the keyboard. The reason I found for this was that in GridView.ensureVisible, the widths of the visible locked columns were not being taken into account as occupying part of the screen.

    The other bug that I encountered was that clicking on a locked column on the left side of the screen would scroll the screen all the way to left. To fix this, I also changed GridView.ensureVisible to not scroll when a locked column was clicked, because it makes no sense for it to do so (locked columns are always visible).

    Here's my code. It could be improved in some places, notably by using ColumnModel.getTotalLockedWidth() rather than my custom method (for whatever reason that method was always returning 0 for me).

    Code:
    /*
     * A custom version of gridView to fix a scrolling problem that hasn't been remedied yet
     */
    framework.customGridView = function(config) {
    	framework.customGridView.superclass.constructor.call(this, config);
    };
    
    Ext.extend(framework.customGridView, Ext.grid.GridView, {
    
    	/*
    	 * How much space the locked columsn take up on the screen.
    	 */
    	lockedCellWidth : 0,
    
    	/*
    	 * A custom version of ensureVisible that also accounts for locked cells taking up room on the left
    	 * of the screen.
    	 */
    	ensureVisible : function(row, col, hscroll){
    		var el = this.getCell(row, col);
    		if(!el){
    			return;
    		}
    		
    		if (this.grid.colModel.isLocked(col)) { //Don't scroll on a locked column
    			return el;
    		}
    	
            		if(typeof row != "number"){
               			row = row.rowIndex;
            		}
            		if(row < 0 && row >= this.ds.getCount()){
                		return;
            		}
            		col = (col !== undefined ? col : 0);
            		var cm = this.grid.colModel;
            		while(cm.isHidden(col)){
                		col++;
            		}
    
    
            		var c = this.scroller.dom;
    
            		var ctop = parseInt(el.offsetTop, 10);
            		var cleft = parseInt(el.offsetLeft, 10);
            		var cbot = ctop + el.offsetHeight;
            		var cright = cleft + el.offsetWidth; //I guess this is cell right
    
            		var ch = c.clientHeight - this.mainHd.dom.offsetHeight;
            		var stop = parseInt(c.scrollTop, 10);
            		var sleft = parseInt(c.scrollLeft, 10);
            		var sbot = stop + ch;
            		var sright = sleft + c.clientWidth; //I guess this is the right of the screen
    		
    		
    		if (this.lockedCellWidth == 0) { //set up the lockedCellWidth
    			//Loop through each of the potential locked cells
    			var cm = this.grid.colModel;
    			var cc = cm.getColumnCount(false);
    			var i;
    			for (i=0; i<cc; i++) {
    				if (cm.isLocked(i) == true && cm.isHidden(i) == false ) {
    					this.lockedCellWidth += cm.getColumnWidth(i);
    				}
    			}
    			if (this.lockedCellWidth == 0) { //No locked columns
    				this.lockedCellWidth = 9999;
    			}
    		}
    				
    		var lw = this.lockedCellWidth;
    		var realCliWidth = c.clientWidth - lw;
    		sright = sleft + realCliWidth;
    
            		if(ctop < stop){
            			c.scrollTop = ctop;
            		}else if(cbot > sbot){
                		c.scrollTop = cbot-ch;
            		}
    
            		if(hscroll !== false){
                		if(cleft < sleft){
                    		c.scrollLeft = cleft;
                		}else if(cright > sright){
                    		c.scrollLeft = cright-realCliWidth;
                		}
            		}
    		
            		return el;
        	}
    });
    Sorry for the tabbing issues.
    Last edited by mike000; 23 Jul 2007 at 12:42 PM. Reason: Edited to make clearer.

  2. #2
    Sencha User jack.slocum's Avatar
    Join Date
    Mar 2007
    Location
    Tampa, FL
    Posts
    6,955
    Vote Rating
    16
    jack.slocum will become famous soon enough

      0  

    Default


    Thanks Mike, we will do some testing and see how it integrates.
    Jack Slocum
    Ext JS Founder
    Original author of Ext JS 1, 2 & 3.
    Twitter: @jackslocum
    jack@extjs.com

Thread Participants: 1

film izle

hd film izle

film sitesi

takipci kazanma sitesi

takipci kazanma sitesi

güzel olan herşey

takipci alma sitesi

komik eğlenceli videolar