Extjs4 grid-editor remote combobox displayValue

Habe ich ein raster mit einigen Spalten werden bearbeitet. Eine der Spalten, die geändert werden soll über eine combobox. Der Kombinationsfeld-store, remote-und Schlüssel-Wert-paar Typ:

['id', 'title']

Combobox valueField ist id und der displayValue ist der Titel. Wenn eine Zelle bearbeitet meine combobox lädt der store, der displayValue ausgewählt ist und das valueField ist zurückgekehrt, um die grid-editor. Also die Zelle ist dann gefüllt mit den valueField.

Meine Frage ist: wie bekomme ich die Zelle zu Rendern, displayValue? Nur wählen Sie es aus dem laden ist nicht gut genug, da das Rendern geschieht, bevor der Speicher geladen wird. Mein code jetzt (das funktioniert mit lokalen Geschäften nur):

{
    header: 'Column title',
    dataIndex: 'id',
    displayField: 'title',
    editor: {
        xtype: 'combo',
        valueField: 'id',
        store: 'myStore',
        displayField: 'title'
    },
    renderer: function(value) {
        //How do I find the editors combobox store?
        store = new myStore();
        index = store.findExact('id', value);
        if (index != -1) {
            rs = store.getAt(index).data;
            return rs.title;
        }
        return value;
    }
}

InformationsquelleAutor cockedpistol | 2011-12-16

3

Dies ist, wie ich es gemacht habe:

Ich habe 2 Shops, storeA für die Netz-und storeB für den Wert ausgewählt werden (wie oben beschrieben). Beide Läden haben eine ID von storeB.

Ich landete hinzufügen eines Felds zu storeA - Titel für storeB ID. Und im Netz habe ich diesen Titel als eine ausgeblendete Spalte. Und in der combobox-editor, Spalte ich mit diesem renderer:
```
  renderer: function(value, metaData, record, rowIndex, colIndex, store, view) {
       //Title is the title for the storeB ID
       return store.data.items[rowIndex].data.title;
  }
```
Auf dem grid ich habe einen listener für das Ereignis Bearbeiten aktualisieren Sie die Spalte mit der überschrift mit dem Titel aus der combobox:
```
  grid.on('edit', function(editor, e, eOpts ) {
       grid.store.data.items[e.rowIdx].set('title', editor.editors.items[0].field.rawValue)
  })
```
Hoffe, dies hilft jemand anderes!

InformationsquelleAutor cockedpistol
2

In Ihrem Modell Definitionen, was ist der Typ von "id". Wenn Sie definieren, wie 'int', haben Sie zu:
```
index = store.findExact('id', parseInt(value));
```
InformationsquelleAutor Clean Potato
0

Wert ist nicht der einzige parameter, der übergeben der renderer siehe docs:
http://docs.sencha.com/ext-js/4-0/#!/api/Ext.grid.Spalte.Spalte-cfg-renderer
Wert : Objekt
```
The data value for the current cell
**metaData** : Object

A collection of metadata about the current cell; 
```
können verwendet oder geändert werden durch den renderer. Anerkannte Eigenschaften sind: tdCls, tdAttr,
und Stil.
```
**record** : Ext.data.Model

The record for the current row
**rowIndex** : Number

The index of the current row
**colIndex** : Number

The index of the current column
**store** : Ext.data.Store

The data store
**view** : Ext.view.View

The current view
```
- Und wie setze ich die Parameter für die Aktualisierung der renderer? Dank
InformationsquelleAutor dbrin

Hier ist die Antwort, bringt das combo-store in den Bereich der renderer:

http://jsfiddle.net/WRXcw/3/

Ext.define('GridModel', {
    extend: 'Ext.data.Model',
    fields: [{
        name: 'id',
        type: 'int'
    },{
        name: 'type_id',
        type: 'int'
    }]
});

Ext.define('ComboModel', {
    extend: 'Ext.data.Model',
    fields: [{
        name: 'id',
        type: 'int'
    },{
        name: 'label',
        type: 'string'
    }],
    statics: {
        TYPE_OPTION_ONE:   1,
        TYPE_OPTION_TWO:   2,
        TYPE_OPTION_THREE: 3,
        TYPE_OPTION_FOUR:  4
    }
});

var comboStore = Ext.create('Ext.data.Store', {
    model: 'ComboModel',
    data: [{
        id: 1,
        label: '1st Option'
    },{
        id: 2,
        label: '2nd Option'
    },{
        id: 3,
        label: '3rd Option'
    }]
});

var gridStore = Ext.create('Ext.data.Store', {
    model: 'GridModel',
    data: [{
        id: 1,
        type_id: ComboModel.TYPE_OPTION_ONE
    },{
        id: 2,
        type_id: ComboModel.TYPE_OPTION_TWO
    },{
        id: 3,
        type_id: ComboModel.TYPE_OPTION_THREE
    },{
        id: 4,
        type_id: ComboModel.TYPE_OPTION_TWO
    }]
});

Ext.widget('grid', {
    title: 'Rendering Combos',
    width: 650,
    height: 500,
    renderTo: 'ct',
    plugins: [
        Ext.create('Ext.grid.plugin.CellEditing', {
            clicksToEdit: 1
        })
    ],
    store: gridStore,
    forceFit: true,
    columns: [{
        dataIndex: 'id',
        header: 'ID'
    },{
        dataIndex: 'type_id',
        header: 'Type',
        editor: {
            xtype: 'combobox',
            displayField: 'label',
            valueField: 'id',
            queryMode: 'local',
            store: comboStore,
            allowBlank: true
        },
        renderer: function(value) {
            var rec = comboStore.getById(value);

            if (rec)
            {
                return rec.get('label');
            }

            return '&mdash;';
        }
    }]
});

InformationsquelleAutor Scott Quinlan

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.