Extjs4 combobox displayValue в сетке - PullRequest
Новая
       5

Extjs4 combobox displayValue в сетке

5 голосов
/ 07 декабря 2011

Пожалуйста, помогите. Я хочу показать свой displayValue в сетке. Я нашел решение здесь , но не могу понять, как его использовать. Мой код: 

columns:[...,{
    header: 'Product',
    id: 'combo',
    locked: true,
    dataIndex: 'prod_id',
    editor: {
        xtype: 'combobox',
        store: new Ext.data.Store({
            fields: ['value','display'],
            data: prod_list
    }),
    displayField: 'display',
    valueField: 'value'
    }
},...]

Решение 

Ext.util.Format.comboRenderer = function(combo){
    return function(value){
    var record = combo.findRecord(combo.valueField || combo.displayField, value);
        return record ? record.get(combo.displayField) : combo.valueNotFoundText;
    }
}

{
    header: 'Товар',
    id: 'combo',
    locked: true,
    dataIndex: 'prod_id',
    editor: MyEditor,
    renderer: Ext.util.Format.comboRenderer(MyEditor)
}

Я пытался определить редактор вне массива столбцов. 

    var MyEditor = new Ext.form.field.ComboBox({
        store: new Ext.data.Store({
            fields: ['value','display'],
            data: prod_list
        }),
        displayField: 'display',
        valueField: 'value'
    });

И все хорошо, , но я не могу его отредактировать . В чем проблема?

Извините за мой английский.

Ответы [ 2 ]

12 голосов
/ 08 декабря 2011 
var myStore = new Ext.data.Store({
    fields: ['value','display'],
    data: prod_list
});

... 

            editor: {
                xtype: 'combobox',
                store: myStore,
                displayField: 'display',
                valueField: 'value'
            },
            renderer: function(val){
                index = myStore.findExact('value',val); 
                if (index != -1){
                    rs = myStore.getAt(index).data; 
                    return rs.display; 
                }
            }
1 голос
/ 14 февраля 2015

У вас отсутствует плагин celleditor .

Лучше всего, если вы определите средство визуализации как объект многократного использования, чтобы вы могли глобально контролировать поведение ваших комбинированных столбцов.

Поскольку вы используете ExtJS4, я добавил альтернативный способ отображения displayField редактора со списком в ячейке, не определяя редактор вне области видимости столбца.

Сначалаопределите рендерер: 

Ext.ns("Ext.ux.util");

Ext.ux.util.ComboRenderer = function(val, metaData){
    var combo = metaData.column.getEditor();
    if(val && combo && combo.store && combo.displayField){
        var index = combo.store.findExact(combo.valueField, val);
        if(index >= 0){
            return combo.store.getAt(index).get(combo.displayField);
        }
    }
    return val;
};

Затем добавьте в свою сетку плагин для целидинга: 

  plugins: [
    {
      ptype: 'cellediting',
      clicksToEdit: 1
    }
  ]

И, наконец, назначьте ComboRenderer для вашегоСвойство рендера столбца выглядит так: 

{
  header: 'Product',
  dataIndex: 'prod_id',
  renderer: Ext.ux.util.ComboRenderer,
  editor: {
    xtype: 'combo',
    store: new Ext.data.Store({
        fields: ['value','display'],
        data: prod_list
    })
  }
}
...