2010-02-23 4 views
1

창 크기에 따라 격자 패널의 크기를 조정하는 방법은 무엇입니까? viewconfig { forcefit:true }하지만 인터넷 탐색기 격자 패널에서는 창 크기가 으로 조정되지 않습니다.격자 크기 조정 문제

이 문제에 제발 도와주세요 :

var grid = new Ext.grid.GridPanel({ 
    store : store, 
    colModel : colModel, 
    view  : gv, 
    stateId : 'myGridid',    
    stateful : true,  
    plugins : [filters],   
    autoHeight : true,    
    stripeRows : true,   
    id   : 'my-grid', 
    title  : xppo.st('SDE_PRINTERS'),   
    viewConfig : { forceFit: true },   
    tbar  : tb, 
    listeners: { 
    cellclick: function(grid, rowIndex, colIndex, e) { 
     colClicked = colIndex; 
     if (colClicked != 0) { 
     if (grid.getColumnModel().getDataIndex(grid.getColumnModel().getColumnId(colIndex)) == 'Incident') { 
      return; } 
     } 

     if (colClicked != 0) { 
     var record = grid.getStore().getAt(rowIndex); 
     var paramInScope = record.get("InScope"); 
     var paramAssetID = record.get("AssetID"); 

     if (paramInScope == 'Yes') { 
      OpenPrinterDetailsPopup(paramAssetID, 800, 600); 
     } else { 
      OpenPrinterDetailsPopup(paramAssetID, 300, 200); 
     } 
     } 

    } 
    , rowdblclick: function(grid, rowIndex, columnIndex, e) { 
     if (colClicked != 0) { 
     var record = grid.getStore().getAt(rowIndex); 
     var paramInScope = record.get("InScope"); 
     var paramAssetID = record.get("AssetID"); 

     if (record == null) { return; } 
     if (paramInScope == 'Yes') { 
      OpenPrinterDetailsPopup(paramAssetID, 800, 600); 
     } else { OpenPrinterDetailsPopup(paramAssetID, 300, 200); } 
     } 
    } 
    , expandedFilter: function() { Ext.getCmp('my-grid').setWidth(860); } 
    , collapsedFilter: function() { Ext.getCmp('my-grid').setWidth(1060); } 
    } 
}); 

var userHidden = false; 
if (showColumn) { grid.getColumnModel().setHidden(23, false); } 
else { grid.getColumnModel().setHidden(23, true); } 

if (fl1) { grid.getColumnModel().setHidden(3, fl1); } 
else { grid.getColumnModel().setHidden(3, flags1); } 

grid.getStore().reload(); 
grid.render('grid-example'); 

}); 

답변

0

forcefit을 : 그리드가 다른 컨테이너의 내부에있는 경우는 true, 비트에만 적용, 저는 믿습니다.

무료 레이아웃 그리드가 있고 외부 레이아웃 관리자가 관리하지 않는 경우 크기를 지정해야한다고 생각합니다.

아마도 가장 쉬운 수정은 ViewPort 또는 테두리 레이아웃을 그리드 위에 한 수준으로 지정한 다음 forceFit 옵션을 지정하는 것입니다.

1

모든 구성 요소가 브라우저 창 전체를 차지하고 크기를 조정하려면 Viewport을 사용하고 레이아웃을 fit으로 설정하십시오. Viewport 브라우저의 몸을 관리되기 때문에 마크 업이 지금 <body></body>을해야

Ext.onReady(function(){ 
    // ...your grid code... 
    //grid.render('grid-example'); <- do not render the grid, the viewport will do this for you 
    var viewport = new Ext.Viewport({ 
    layout: 'fit', 
    items: [grid] 
    }); 
}); 

참고.

+0

나는 그리드에 대한 뷰포트를 제공하고 grid.render 라인을 주석 처리했지만 웹 페이지에는 그리드가 표시되지 않습니다. 내 코드는 스크립트 태그에서 javascript를 제공 한 ascx 페이지에 있습니다. 당신은 마크에 대한 바디 태그를 언급했는데 그 부분을 얻었습니다. 설명해 주시겠습니까? – xrx215

+0

다음은 그리드와 함께 사용할 수있는 Ext JS Viewport complete html 페이지입니다. http://gist.github.com/313826 –

+0

감사합니다. 감사합니다. – xrx215