2011-10-20 4 views
1

4의 스크롤 막대에 문제가 있습니다. 가로 스크롤 막대가 표시되지 않고 세로 스크롤 막대가 움직이지 않습니다. 나는 구글 크롬, IE와 파이어 폭스에서 코드를 테스트한다. javascript는 오류를 표시하지 않습니다. 모든treepanel extjs 4의 스크롤 막대가 작동하지 않습니다.

{ 
    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의 문제는, 코드의 일부이다.

+0

의 내선 버그를 해결합니다. 종종 이것은 더 엄격한 레이아웃을 사용하여 해결할 수 있습니다. 왜냐하면 productos_panel의 높이가 너무 커서 수평 스크롤바가 뷰포트 아래에 있기 때문입니다. 지금 가지고있는 한가지 생각은'panel_side_bar'에 고정 된'height'를 설정하는 것입니다. 테두리 레이아웃에는 정의 된 높이가 필요합니다. –

+0

높이를 "100 %"로 설정하면 도움이됩니다. –

+0

고맙습니다, Radomir, 높이가 퍼센트로 설정되지 않았습니다. 홀수. – w00x

답변

5

이 Ext.override를 추가하면 도움이 될 수 있습니다. Ext 포럼에서 어딘가에 그것을 발견하고 이후 TreeGrid 스크롤바 문제를 발견하지 못했습니다. 구성 요소가 인스턴스화 된 후 나는 자바 스크립트를 통해 오버 플로우와 높이를 설정하여이 문제가 나를 위해 고정 된 것을 발견

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 
    } 

}); 
0

: 당신이 MVC 구조를 사용하는 경우 다만, 몇 가지 주요 코드 파일에 같은 app.js를 던져 :

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

kludge 아마도,하지만 복잡한 레이아웃과 수평/수직 스크롤에 문제가 AFAIK 나