Page 4 of 5 FirstFirst ... 2345 LastLast
Results 31 to 40 of 48

Thread: How to prevent extjs grid from scrolling when clicking on a cell ?

    Success! Looks like we've fixed this one. According to our records the fix was applied for EXTJS-3994 in 4.2.0.663.
  1. #31
    Sencha Premium Member
    Join Date
    Jan 2011
    Posts
    17
    Vote Rating
    0
      0  

    Default

    Yeah, I know this stackoverflow link. But this workaround works only for 4.0.7 for the RowModel selection. In 4.1.1 the RowModel selection bug is already fixed BUT not the one of the CellModel selection... I think a workaround for 4.1.1 is hopeless, isn't it?! :-(

  2. #32
    Sencha User
    Join Date
    Dec 2012
    Posts
    1
    Vote Rating
    0
      0  

    Default

    I still faced this problem in IE8/ExtJS 4.1.1 with a TreeGrid and found some workaround:

    Code:
    Ext.override(Ext.dom.Element, {
        focus: function(defer, dom) {
            var me = this;
            var scrollTop = undefined;
            var body;
            
            dom = dom || me.dom;
            body = (dom.ownerDocument || DOC).body || DOC.body;
            try {
                if (Number(defer)) {
                    Ext.defer(me.focus, defer, me, [ null, dom ]);
                } else {
                    if (dom.offsetHeight > Element.getViewHeight()) {
                        scrollTop = body.scrollTop;
                    }
                    dom.focus();
                    if (scrollTop !== undefined) {
                        body.scrollTop = scrollTop;
                    }
                }
            } catch (e) {
            }
            return me; 
        }
    });
    Code of function above was just copied from Ext.dom.Element.focus opened in Firebug. I don't know, why this solution works, but it does. I guess, there's some override in ExtJS core for IE, that causes the bug.

    I tried something like
    Code:
    Ext.override(Ext.dom.Element, { focus: Ext.dom.Element.prototype.focus }
    but it's still scrolling.

  3. #33
    Sencha Premium Member
    Join Date
    Jul 2007
    Posts
    117
    Vote Rating
    1
      0  

    Default Not fixed in 4.1.3

    Do not bother upgrading to 4.1.3 in hopes of having this bug fixed for cell model because I just did and it isn't fixed.
    Ext-4.2.1 / Windows 7 SP1 / Firefox 24 / Firebug 1.12.2

  4. #34
    Sencha User
    Join Date
    Oct 2011
    Location
    Ukraine
    Posts
    154
    Vote Rating
    8
      0  

    Default Fixed or NOT?

    Hi I found a solution for myself and I want to share it with you.
    @msec
    You code actualy almost work, but... it has an exception on Element.getViewHeight(), thats why line dom.focus() not called. But this line is actually do that scroll jumping in IE.And input field can't get focus.
    So my solution is:
    PHP Code:
    Ext.override(Ext.dom.Element, {
        
    focus: function(deferdom) {
            var 
    me this,
              
    scrollTop undefined,
              
    body;
            
            
    dom dom || me.dom;
            
    body = (dom.ownerDocument || DOC).body || DOC.body;
            try {
              if (
    Number(defer)) {
                
    Ext.defer(me.focusdeferme, [ nulldom ]);
              } else {
                if (
    dom.offsetHeight Ext.dom.Element.getViewHeight()) {
                                            
    //Change from Element.getViewHeight()
                  
    scrollTop body.scrollTop;
                }
                if (
    Ext.isIE){
                  if (
    dom.id.indexOf('inputEl') > -1){
                    
    //this focus is called also for view, and then scroll begins but we need to focus only in particular cell (some input field).
                    
    dom.focus();
                  }
                } else {
                  
    dom.focus();
                }
                if (
    scrollTop !== undefined) {
                  
    body.scrollTop scrollTop;
                }
              }
            } catch (
    e) {}
            return 
    me
        }
    }); 
    It not fully tested so I'll wait for you feedback.

  5. #35
    Sencha Premium Member
    Join Date
    Jul 2007
    Posts
    117
    Vote Rating
    1
      0  

    Default

    I tested in IE9 and it works! Thank you sir
    Ext-4.2.1 / Windows 7 SP1 / Firefox 24 / Firebug 1.12.2

  6. #36
    Sencha User
    Join Date
    Feb 2013
    Posts
    1
    Vote Rating
    0
      0  

    Default Unintended consequences.

    So yes, technically this fixes the original bug. However, now I'm seeing the opposite effect. When I click the cell it doesn't scroll like it used to but when I click outside the cell the page scrolls back to the top.

    I tried adding a 'blur' property with the same function as the 'focus' but that didn't help.

  7. #37
    Sencha User
    Join Date
    Mar 2010
    Posts
    1
    Vote Rating
    0
      0  

    Default

    I found this fix which worked in my situation.

    I overrided the onSelectChange function of the selection model i was using for my grid to set the suspendedLayout property of the grid to true. This prevents the grid from refreshing itself when an item is selected. I am still testing it out so I am not certain if there are any side effects to it as yet. Please provide your feedback.

    Code:
    Ext.define('My.selection.CheckboxModel', {
        extend: 'Ext.selection.CheckboxModel',
        
        showHeaderCheckbox: false, 
        mode: 'SIMPLE',
        preventFocus: true,
        
        listeners: {
            selectionchange: function(sel, records){
                ////Do something......
            }
        },
    
    
        /**
         * Fix to prevent grid from scrolling to top when a record is selected
         **/
        onSelectChange: function(record, isSelected, suppressEvent, commitFn) {
            grid = Ext.ComponentQuery.query('#grid-item-id')[0];
            grid.suspendLayout = true;
            
            this.callParent(arguments);
        }
    });

  8. #38
    Sencha Premium Member
    Join Date
    Jul 2007
    Posts
    117
    Vote Rating
    1
      0  

    Default Fixed in 4.2

    I submitted a bug and it seems to be fixed in 4.2 (PS before the fix, I noticed if you specify a height: for the grid you could avoid the issue)
    Ext-4.2.1 / Windows 7 SP1 / Firefox 24 / Firebug 1.12.2

  9. #39
    Sencha Premium Member
    Join Date
    Jul 2007
    Posts
    117
    Vote Rating
    1
      0  

    Default

    Apparently there's another similar issue http://www.sencha.com/forum/showthre...47737&posted=1
    Ext-4.2.1 / Windows 7 SP1 / Firefox 24 / Firebug 1.12.2

  10. #40
    Sencha User
    Join Date
    Apr 2013
    Posts
    1
    Vote Rating
    0
      0  

    Default

    nm

Page 4 of 5 FirstFirst ... 2345 LastLast

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •