2013-01-16 10 views
5

Mam aplikacji przy użyciu ExtJs 3.4.
mam ten budowy:Jak dopasować kolumny gridPanels?

westPanel-TabPanel:

var westPanel = new Ext.TabPanel({ 
      id: "west", 
      //xtype: "tabpanel", 
      //layout:'fit', 
      activeTab: 0, 
      region: "west", 
      border: false, 
      width: 278, 
      split: true, 
      collapseMode: "mini", 
      items: [mapList,structure,cadastr,search] 
     }); 

wyszukiwania - FormPanel:

var search = new Ext.FormPanel({ 
       labelAlign: 'top', 
       frame:true, 
       title: 'Поиск', 
       bodyStyle:'padding:5px 5px 0', 
       //width: 600, 
       //layout:'fit', 
       items: [{ 
        xtype:'textfield', 
        fieldLabel: 'Диспечерское наименование', 
        name: 'name_dispather', 
        anchor:'100%', 
        enableKeyEvents: true, 
        listeners: { 
         'keyup': function(e) { 
          if(e.getValue().length==4){ 
           searchStore.load({params:{'name':e.getValue()}}); 
          } 
         } 
        } 
       },searchTab] 
      }); 

SearchTab - GridPanel:

var searchTab = new Ext.ux.grid.livegrid.GridPanel({ 
    store: searchStore, 
    region: 'center', 
    cm: searchCm, 
    layout: 'fit', 
    selModel: new Ext.ux.grid.livegrid.RowSelectionModel(), 
    stripeRows : true, 
    view: myView, 
    height: 390, 
    loadMask: true, 
    id: 'searchTab', 
    title:'Найденные объекты', 
    autoScroll: true, 
}); 

i mam problem:

enter image description here

Czy szerokość ostatniej kolumny musi być równa szerokości całego panelu?

UPDATE

staram autoExpandColumn. jego prace, ale jej nie idial:

enter image description here

Jak to naprawić?

Odpowiedz

5

Możesz to osiągnąć dzięki konfiguracji flex.

Można to zrobić na tylko jedna kolumna:

columns: [{text: "Column A", dataIndex: "field_A", flex: 1}] 

Albo można to zrobić domyślnie na wszystkich kolumnach:

columns: { 
    items: [ 
     { 
      text: "Column A" 
      dataIndex: "field_A" 
     },{ 
      text: "Column B", 
      dataIndex: "field_B" 
     }, 
     ... 
    ], 
    defaults: { 
     flex: 1 
    } 
} 
+0

+1 dla domyślnych, tylko nie użyłbym tego, ponieważ najprawdopodobniej będziesz miał kolumny zawierające szerokość, a myślę, że flex overrules width. –

+0

flex powinien być ustawiony tylko na te kolumny, które mają być rozwijane automatycznie. Myślę, że większość razy to nigdy nie wszystko. – seba

+0

'@ JohanHaest' Flex rzeczywiście nadpisuje określoną szerokość. '@ seba' Tak, myślałem, że się nim podzielę :). – A1rPun

4

Spróbuj z:

autoExpandColumn : String

Identyfikator kolumny w tej siatce, która powinna zostać rozwinięta, aby wypełnić nieużywane miejsce .

Ta opcja konfiguracyjna, którą musisz podać dla wyszukiwaniaTab (mam na myśli panel siatki).

edycja:

viewConfig:{ 
     scrollOffset: 0, 
    forceFit: true 
    }, 

To usunie tę lukę do przewijania. To trzeba wspomnieć o swoim searchTab (mam na myśli panel siatki).

+1

zgodnie z sencha to jest przestarzałe i nie powinno być używane – seba

+0

@vajrakumar: Próbuję autoExpandColumn.Działa, ale z jednym problemem, takim jak om, którego aktualizacja dotyczy. –

+0

To miejsce jest dla paska przewijania, jeśli rekord przychodzi więcej niż pasek przewijania pojawi się w tym miejscu. W jaki sposób możemy zrobić to miejsce. Daj trochę czasu, aby opublikować. – vajrakumar