PDA

View Full Version : How to use Ext.grid.EditorGridPanel with Ext.form.ComboBox



Ex_Soft
11 Nov 2010, 11:53 AM
store1 = new Ext.data.XmlStore({
url: "Grid1.xml",
record: "row",
idPath: "Id",
fields: [
{ name: "Id", type: "int" },
"Field1",
"Field2"
]
}),
store1Options = new Ext.data.XmlStore({
url: "Grid1Options.xml",
record: "row",
idPath: "Id",
fields: [
{ name: "Id", type: "int" },
"Value"
]
}),
ComboBoxField2 = new Ext.form.ComboBox({
store: store1Options,
valueField: "Id",
displayField: "Value",
emptyText: "Select...",
loadingText: "Loading...",
allowBlank: true,
triggerAction: "all",
editable: false,
mode: "local",
forceSelection: true,
selectOnFocus: true
}),
colModel = new Ext.grid.ColumnModel({
columns: [
{ id: "ColField1", dataIndex: "Field1", header: "Field1", width: 100, sortable: false, align: "left" },
{ dataIndex: "Field2", header: "Field2", width: 100, sortable: false, align: "center", editor: ComboBoxField2 }
]
}),
grid = new Ext.grid.EditorGridPanel({
store: store1,
clicksToEdit: 1,
colModel: colModel
})
It works. But there is Id's value in cell after edit. Should it be like that?
23297 (Changing grid panel data using cell editors (Ext JS 3.0 Cookbook) http://mytrouble.ru/sites/default/files/imagecache/node-gallery-display/54.jpeg)

Ex_Soft
15 Nov 2010, 5:53 AM
store1 = new Ext.data.XmlStore({
url: "Grid1.xml",
record: "row",
idPath: "Id",
fields: [
{ name: "Id", type: "int" },
"Field1",
{ name: "Field2", type: "int" }
]
}),
...
OptionsShower = function(value, metadata, record, rowIndex, colIndex, store)
{
return store1Options.getById(value).get("Value");
},
colModel = new Ext.grid.ColumnModel({
columns: [
{ id: "ColField1", dataIndex: "Field1", header: "Field1", width: 100, sortable: false, align: "left" },
{ dataIndex: "Field2", header: "Field2", width: 100, sortable: false, align: "center", renderer: OptionsShower, editor: ComboBoxField2 }
]
}),
...