Faites défiler le problème lorsque vous cliquez sur Extjs Grid RowExpander

Question

Je suis confronté à un problème lors de l'utilisation extjs grid rowexpander. Procédure de reproduction:
1. Développez la première ligne.
2. Faites maintenant défiler jusqu'au dernier enregistrement de la grille.
3. Développer maintenant la dernière rangée. Vous verrez la barre de défilement se déplacer automatiquement vers le haut.

Merci pour l'aide

Ext.create('Ext.grid.Panel', { 
    margin: '30 2 0 0', 
    layout: 'fit', 
    scrollable: 'vertical', 
    cls: 'logTimeInTask', 
    bodyCls: 'scrollBar', 
    renderTo:Ext.getBody(), 
    maxHeight: 400, 
    title: 'timeEntryDetail', 
    scrollable: true, 
    collapsible: false, 
    columnLines: false, 
    expandOnDblClick: false, 
    viewConfig: { 
     preserveScrollOnRefresh: true, 
     preserveScrollOnReload: true 
    }, 
    columns: [{ 
     text: 'timeLoggedBy', 
     menuDisabled: true, 
     sortable: false, 
     flex: 1, 
     renderer: function (value, p, record) { 
      var retDataStr = ''; 
      retDataStr += Ext.String.format('<span>{0}</span>', record.data.creator); 
      return retDataStr 
     } 
    }, { 
     text: 'time', 
     sortable: false, 
     menuDisabled: true, 
     width: 120, 
     renderer: function (value, p, record) { 
      var retDataStr = ''; 
      if (record.data.logged_hours != null) { 
       retDataStr += record.data.logged_hours + 'h '; 
      } 
      if (record.data.logged_mins != null) { 
       retDataStr += record.data.logged_mins + 'm '; 
      } 
      return retDataStr; 
     } 
    }, { 
     text:'date', 
     sortable: false, 
     menuDisabled: true, 
     width: 100, 
     renderer: function (value, p, record) { 
      return record.data.date; 
     } 
    }, { 
     text: 'status', 
     sortable: false, 
     menuDisabled: true, 
     dataIndex: 'status', 
     width: 120, 
     renderer: function (value, p, record) { 
      return Ext.String.capitalize(record.data.status); 
     } 

    }], 
    plugins: [{ 
     ptype: 'rowexpander', 
     rowBodyTpl: new Ext.XTemplate(
      '<p><b>timesheet:</b> {timesheet}</p>', 
      '<tpl if="description!=null">', 
      '<p><b>description:</b> {[this.showDescription(values)]}</p>', 
      '</tpl>', { 
       showDescription: function (values) { 
        return values.description; 
       } 
      } 
     ) 
    }], 
    listeners: { 
     render: function (grid) { 
       var timeEntryDetailStore = new Ext.data.JsonStore({ 
        data: [{"id":80930195009,"status":"none","description":"dfsgdfsgsd\nfg\ndsf\ng\ndsf\ng\nsdfg\nsdfg","date":"2017-07-17","created_at":"2017-07-17T09:38:32+00:00","logged_hours":3,"logged_mins":54,"timer":false,"timesheet":"111111111111","task_id":14763865922,"sort":0,"project":909679456,"project_name":"wwwwwwwwwwwwwww","creator":1270919337},{"id":80930208578,"status":"none","description":"dsfv dfd sfg\ndsf \ng\ndfsg \ndfsg\n\ndsg\nds\ng\ndfs\ngdsfg\n dfg","date":"2017-07-17","created_at":"2017-07-17T09:39:04+00:00","logged_hours":12,"logged_mins":4,"timer":false,"timesheet":"111111111111","task_id":14763865922,"sort":0,"project":909679456,"project_name":"wwwwwwwwwwwwwww","creator":1270919337},{"id":80930222146,"status":"none","description":"So the problem here is whenever we open a popup window ExtJS library is needed and it is taking up a lot of memory in IE.\n\nIs there any other way we can load a browser window popup with ExtJS grid without loading the whole ExtJS framework?\n\nOr any other idea are most welcome, as we are really facing a lot of memory issues in IE and users are not willing to use chrome.","date":"2017-07-17","created_at":"2017-07-17T09:39:38+00:00","logged_hours":4,"logged_mins":3,"timer":false,"timesheet":"111111111111","task_id":14763865922,"sort":0,"project":909679456,"project_name":"wwwwwwwwwwwwwww","creator":1270919337},{"id":80930235715,"status":"none","description":"So the problem here is whenever we open a popup window ExtJS library is needed and it is taking up a lot of memory in IE.\n\nIs there any other way we can load a browser window popup with ExtJS grid without loading the whole ExtJS framework?\n\nOr any other idea are most welcome, as we are really facing a lot of memory issues in IE and users are not willing to use chrome.","date":"2017-07-17","created_at":"2017-07-17T09:39:44+00:00","logged_hours":3,"logged_mins":54,"timer":false,"timesheet":"111111111111","task_id":14763865922,"sort":0,"project":909679456,"project_name":"wwwwwwwwwwwwwww","creator":1270919337},{"id":80930249284,"status":"none","description":"So the problem here is whenever we open a popup window ExtJS library is needed and it is taking up a lot of memory in IE.\n\nIs there any other way we can load a browser window popup with ExtJS grid without loading the whole ExtJS framework?\n\nOr any other idea are most welcome, as we are really facing a lot of memory issues in IE and users are not willing to use chrome.","date":"2017-07-17","created_at":"2017-07-17T09:39:50+00:00","logged_hours":39,"logged_mins":2,"timer":false,"timesheet":"111111111111","task_id":14763865922,"sort":0,"project":909679456,"project_name":"wwwwwwwwwwwwwww","creator":1270919337},{"id":80930262852,"status":"none","description":"So the problem here is whenever we open a popup window ExtJS library is needed and it is taking up a lot of memory in IE.\n\nIs there any other way we can load a browser window popup with ExtJS grid without loading the whole ExtJS framework?\n\nOr any other idea are most welcome, as we are really facing a lot of memory issues in IE and users are not willing to use chrome.","date":"2017-07-17","created_at":"2017-07-17T09:39:57+00:00","logged_hours":3,"logged_mins":54,"timer":false,"timesheet":"111111111111","task_id":14763865922,"sort":0,"project":909679456,"project_name":"wwwwwwwwwwwwwww","creator":1270919337}] 
       }); 
       grid.setStore(timeEntryDetailStore); 

     } 
    } 
}) 

Answer 1

j'ai collé dans votre exemple un violon Sencha, et tout cela se passe dans 6.0.0 à 6.0.2, il semble fixé à 6.2.0 à 6.5.0.

J'ai donc comparé le working source code avec le code source non fonctionnel et trouvé la modification. Voici un remplacement de travail pour vous:

Ext.define('Override.RowExpander',{ 
    override:'Ext.grid.plugin.RowExpander', 
    toggleRow: function(rowIdx) { 
     this.callParent(arguments); 
     this.grid.ensureVisible(rowIdx); 
    } 
});