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

Question

У меня проблема с полосой прокрутки в extjs 4. Горизонтальные полосы прокрутки не отображаются, а вертикальные полосы прокрутки не перемещаются. Я тестирую код в Google Chrome, IE и Firefox. Javascript не показывает ошибки.

Это часть кода, в productos_panel есть проблема:

{
    xtype: 'container',
    id: 'panel_side_bar',
    margin: 5,
    width: 250,
    autoScroll:true,
    layout: {
        type: 'border'
    },
    region: 'west',
    items: [
        {
            xtype: 'treepanel',
            id: 'productos_panel',
            title: 'Listado de Productos',
            rootVisible:false,
            autoScroll : true,
            region: 'center',
            root: getDirectJSON("<?php echo url_for("@get_categoria_prod",true)?>"),
            viewConfig: {
                id: 'productos'
            },
            listeners: {
                itemclick: {
                        fn: evtClickItemTree
                }
            }
        },
        {
            xtype: 'container',
            height: 51,
            id: 'botonera',
            layout: {
                type: 'vbox'
            },
            region: 'north',
            items: [
                text_input_filtro,
                {
                    xtype: 'container',
                    id: 'contenedor_btns_filtro',
                    height: 25,
                    width:250,
                    layout: {
                        type: 'hbox'
                    },
                    items: [
                        {
                            xtype: 'button',
                            id: 'button_filtrar',
                            text: 'Filtrar',
                            handler: evtButtonFiltrar,
                            flex: 1
                        },
                        {
                            xtype: 'button',
                            id: 'button_mostrar_todo',
                            text: 'Mostrar Todo',
                            handler: evtButtonMostrarTodo,
                            flex: 1
                        }
                    ]
                }
            ]
        }

Спасибо за все.

Answer 1

Добавление этого Ext.override может вам помочь. Я нашел это где-то на форумах Ext, и с тех пор я не заметил никаких проблем с полосой прокрутки TreeGrid. Просто добавьте его в какой-нибудь основной файл кода, такой как app.js если вы используете структуру MVC:

Ext.override(Ext.grid.Scroller, {

  afterRender: function() {
    var me = this;
    me.callParent();
    me.mon(me.scrollEl, 'scroll', me.onElScroll, me);
    Ext.cache[me.el.id].skipGarbageCollection = true;
    // add another scroll event listener to check, if main listeners is active
    Ext.EventManager.addListener(me.scrollEl, 'scroll', me.onElScrollCheck, me);
    // ensure this listener doesn't get removed
    Ext.cache[me.scrollEl.id].skipGarbageCollection = true;
  },

  // flag to check, if main listeners is active
  wasScrolled: false,

  // synchronize the scroller with the bound gridviews
  onElScroll: function(event, target) {
    this.wasScrolled = true; // change flag -> show that listener is alive
    this.fireEvent('bodyscroll', event, target);
  },

  // executes just after main scroll event listener and check flag state
  onElScrollCheck: function(event, target, options) {
    var me = this;

    if (!me.wasScrolled) {
      // Achtung! Event listener was disappeared, so we'll add it again
      me.mon(me.scrollEl, 'scroll', me.onElScroll, me);
    }
    me.wasScrolled = false; // change flag to initial value
  }

});

Answer 2

Я обнаружил, что эта проблема была исправлена ​​для меня, установив переполнение и высоту с помощью javascript после создания экземпляра компонента:

Ext.getCmp('navTree').el.dom.style.height = '100%';
Ext.getCmp('navTree').el.dom.style.overflow = 'scroll';

Клудж, возможно, но это исправляет ошибку Ext для меня