如何在ExtJS網格編輯器中正確設置組合框值？

我有一個網格，並希望使用組合框作爲網格單元格編輯器。編輯組合框的值應取決於我的數據記錄多個字段，所以我嘗試設置組合框的值在網格的beforeEdit監聽器，像這樣：如何在ExtJS網格編輯器中正確設置組合框值？

beforeEdit: function (editor, e, options) { 
    var field = e.field; 
    var combo = e.grid.columns[e.colIdx].getEditor(e.record); 
    var force = e.record.get('forced'); 
    switch (force) { 
     case 'Y': 
      combo.setValue("Force active"); 
      break; 
     case 'N': 
      combo.setValue("Force inactive"); 
      break; 
     default: 
      combo.setValue("Default"); 
      break;        
    } 
}

我的組合框像這樣定義的，所以它包含每個在我的beforeEdit處理顯示可能的選項：

editor: { 
    xtype: 'combobox', 
    forceSelection: true, 
    editable: false, 
    triggerAction: 'all', 
    allowBlank: false, 
    store: [ 'Default', 'Force active', 'Force inactive' ] 
}

我的問題是，雖然正確的條目在下拉列表中選擇，組合框的文本部分保持爲空。

enter image description here

我怎樣才能說服編輯組合框也顯示在組合的文本框部分的價值？

這裏有一個煎茶搗鼓這個便籤：https://fiddle.sencha.com/#fiddle/9vd

來源

2014-09-05 Chris Farmer

你應該能夠完成你正在尋找通過使用編輯器中的emptyText配置做什麼組合框組件，like so：

beforeEdit: function (editor, e, options) { 
    var field = e.field; 
    var combo = e.grid.columns[e.colIdx].getEditor(e.record); 
    var force = e.record.get('forced'); 
    switch (force) { 
     case 'Y': 
      combo.setValue("Force active"); 
      break; 
     case 'N': 
      combo.setValue("Force inactive"); 
      break; 
     default: 
      combo.setValue("Default"); 
      break;       
    } 
    combo.emptyText = combo.getValue(); 
}

來源

2014-09-08 20:43:33

你需要添加dataIndex：「calculated_active」，第二列

來源

2014-09-05 17:18:08 I3i0

謝謝。我同意我在創建小提琴時缺少了該配置選項，但似乎並未改變下拉文本值爲空的事實。我還希望組合框的行爲像一個HTML選擇（沒有自由格式的文本輸入），所以我更新了我的小提琴以包含這些配置。現在，您可以更好地看到單擊可編輯單元格時只顯示空白的編輯器文本。 – 2014-09-05 17:52:46

forceSelection是真的..所以當你點擊單元格時，組合框試圖找到預存的值ex：'Y'在它的存儲女巫中沒有值等於Y，所以當你點擊它時顯示一個空值。因此，要麼刪除forceSelection：true，要麼將選定的值包含在組合框中的calculated_active列中 – I3i0 2014-09-05 22:39:39

我不明白。我的問題的重點是我想顯示與dataIndexed字段中的值不同的下拉列表。這是我練習的要點：試圖在beforeEdit中用setValue設置組合框的值。顯示編輯組合之前。我不希望該數據索引字段的值顯示在我的組合框中。 – 2014-09-05 23:28:35

您可以設置在列渲染器顯示值你想：（這裏是一個fiddle）

{ 
        text: 'Active?', 
        dataIndex: 'calculated_active', 
        editor: { 
         xtype: 'combobox', 
         forceSelection: true, 
         editable: false, 
         triggerAction: 'all', 
         allowBlank: false, 
         valueField:'value', 
         displayField:'descr', 
         store: Ext.create('Ext.data.Store',{ 
          fields:['descr','value'], 
          data:[{ 
           descr:'Default', 
           value:'' 
          },{ 
           descr:'Force active', 
           value:'Y' 
          },{ 
           descr:'Force inactive', 
           value:'N' 
          }] 
         }) 
        }, 
        flex: 1, 
        renderer:function(value,metaData,record){ 
         switch(value){ 
          case 'Y': 
          return "Force active"; 
         case 'N': 
          return "Force inactive"; 
         default: 
          return "Default"; 
         } 
        } 
       }

來源

2014-09-06 00:29:55 weeksdev

如何在ExtJS網格編輯器中正確設置組合框值？

回答

相關問題