Полоса прокрутки панели сетки в Extjs 4 не работает

Question

var gusersPanel = Ext.create('Ext.grid.Panel', {
    flex:1,
    columns: [{
        header: 'User Login',
        dataIndex: 'user_login',
        width:150
    },{
        header: 'User Name',
        dataIndex: 'user_nicename',
        width:150
    },{
        header:'Privledge',
        dataIndex:'admin',
        width:150
    }],
    autoScroll: true,
    layout:'fit',
    selModel: gusersSel,
    store: gusersStore

})

Привет! Я использую приведенный выше код для панели сетки в Extjs4.0.2a. Когда я динамически заполняю данные в хранилище, полосы прокрутки не работают. Я также попытался использовать doLayout () для панели сетки, но также не работает. Панель сетки находится в окне.

Что-нибудь, что может решить эту проблему?

На самом деле это работает некоторое время, но не работает все время.

Answer 1

У меня была такая же проблема.Они используют собственную полосу прокрутки, и она довольно глючная (особенно в Chrome).Если вы не собираетесь использовать бесконечную прокрутку, возможное решение может состоять в том, чтобы удалить пользовательскую полосу прокрутки и использовать собственную.Для этого просто добавьте в конфигурацию сетки следующее:

var gusersPanel = Ext.create('Ext.grid.Panel', {
  scroll          : false,
  viewConfig      : {
    style           : { overflow: 'auto', overflowX: 'hidden' }
  },
  // ...
});

Answer 2

Я сделал gusersPanel.determineScrollbars (), когда добавляю и удаляю данные из хранилища, и он работает нормально.

Answer 3

Проблема с этим заключается в том, что прослушиватель прокрутки присоединяется к элементу div в событии afterrender, но затем, если полоса прокрутки не требуется после операции макета, элемент div удаляется из dom. Затем, когда он снова нужен, он добавляется обратно, но только если прошло достаточно времени, сборщик мусора заставляет extjs воссоздавать узел div, и на этот раз он добавляется в dom, не подключая прослушиватель прокрутки снова. Следующий код решает проблему:

Ext.override(Ext.grid.Scroller, {
    onAdded: function() {
        this.callParent(arguments);
        var me = this;
        if (me.scrollEl) {
            me.mun(me.scrollEl, 'scroll', me.onElScroll, me);
            me.mon(me.scrollEl, 'scroll', me.onElScroll, me);
        }
    }
});

Answer 4

Вы написали код для макета: «подходит».Не работает автопрокрутка.

Измените код на некоторую высоту и удалите раскладку: код 'fit'.

Вот так.

var gusersPanel = Ext.create('Ext.grid.Panel', {
    flex:1,
    columns: [{
   ...........
    }],
autoScroll: true,
//layout:'fit',
height: 130,
selModel: gusersSel,
store: gusersStore

Это поможет вам.Приветствия.