treepanel extjs 4のスクロールバーが機能しない

Question

extjs 4のスクロールバーに問題があります。 水平スクロールバーが表示されず、垂直スクロールバーが移動しません。私はGoogle Chrome、IE、Firefoxでコードをテストします。 JavaScriptはエラーを表示しません。すべてのための

{ 
    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 
         } 
        ] 
       } 
      ] 
     } 

ありがとう：

この

はproductos_panelに問題があり、コードの一部です。

Answer 1

このExt.overrideを追加すると役立ちます。私はExtフォーラムのどこかでそれを見つけました。それ以来、私はTreeGridスクロールバーの問題に気づいていません。コンポーネントがインスタンス化された後、私はjavascriptを介して、オーバーフローと高さを設定することで、この問題は私のために固定していることがわかっ

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

：あなたはMVC構造を使用している場合だけで、いくつかの主要なコードファイルになどapp.jsそれを投げます：おそらく

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

その場しのぎのが、複雑なレイアウトや水平/垂直スクロールバーに問題がある私の知る限り、それは私