2010-11-12 144 views
1

出現問題,需要您的建議ExtJS編輯器網格中的自定義編輯控件

我剛開始編寫一個編輯器網格。 (我將實際使用此網格作爲搜索過濾器編輯器,即具有條件名稱,運算符和值的列)。 現在,對於值字段,我希望對不同的行有不同的編輯控件。例如,當條件類型是字符串時,我想顯示一個文本框,當它是日期時間時,我想要一個日期時間編輯器。所以事實是,我需要在編輯開始之前控制「編輯控件創建/顯示」。並且它們在行之間應該是不同的。不像我找到的列是固定的例子。

爲了實現這一點,你們可以請你提出我需要做的步驟嗎?如果你們中的一個人能夠指導我,我可以弄清楚它。

感謝和問候

回答

3

其實你可以很容易地通過動態返回不同的編輯器做到這一點,根據您所在的列進行渲染。在您的ColumnModel對象中,您可以定義如下所示的內容。請注意,我得到每個記錄的類型屬性以確定其類型。我有一個包含我所有不同類型的編輯器的對象,並且對於渲染器也是如此,然後基於類型i爲該單元格提供不同的編輯器或渲染器。

editors: { 'default': {xtype:'textfield'}, 
      texttype: {xtype:'textfield'}, 
      numbertype: {xtype:'numberfield'}, 
      combotype: {xtype:'combo'}....... etc. } 

getCellEditor: function(colIndex, rowIndex) { 
      var store = Ext.getCmp('mygrid').getStore(); 
      var field = this.getDataIndex(colIndex); 
      var rec = store.getAt(rowIndex); 
      var type = rec.get('type'); 
      if (type in this.editors) { 
       return this.editors[type]; 
      } else { 
       return this.editors['default']; 
      } 

     }, 
0

在你editorgrid的配置部分,你需要定義你的自定義編輯器:

{ 
    xtype: 'editorgrid', 
    id : 'mygridID', 
    stripeRows: true, 
    ... 
    ... 
    ,customEditors : { 
    //configs go here or pre-define the configs prior to this 
    'columnName1' : new Ext.grid.GridEditor(new Ext.form.Combobox(configObject)), 

    //configs go here or pre-define the configs prior to this 
    'columnName7' : new Ext.grid.GridEditor(new Ext.form.CheckBox(configObject)) 
    } 
} 
+0

謝謝您的答覆。但你錯過了我的問題,對於每一行我可能需要不同的編輯器控件..不像你在這裏顯示的。它不是列,而是行。 – Moim 2010-11-16 07:32:10

+0

對不起,我絕對誤讀了這個問題。我不知道如何在沒有嵌套數據網格或使用多個網格的情況下完成此操作。問題是列模型需要在網格中的所有行上保持一致。 – 2010-11-16 14:44:15

0

使用該網格的配置 - 以便選擇整行:

selType: 'rowmodel'