Hi all,
in dojo terms a cell in a grid is the column. I define editors for each column.
My problem is now that i need different editors in a column. e.g. an entry fied in row 1, a checkbox in row 2 and another entry field in row 3.
Is this possible with a grid? I didn't find anything like that in the documentation and examples.
Help here would be very nice.
Is this Possible?
I am having the same issue and am not sure how to have different editors for different rows within the same column. Does anyone know if this is possible to do? Thanks.
a small hack (custom editor)
Hi,
I had the same problem and solved (or rather "hacked") it by creating my own editor
that delegates all actions to one of standard editors, depending on value in another column of the grid.
the code fragment of my editor looks like:
"my.grid.editors.Dynamic",
dojox.grid.editors.Base, {
constructor: function(inCell, /* (int) related column index*/ propertyCellIndex, cells, def){
this.propertyCellIndex = propertyCellIndex;
this.model = inCell.grid.model;
var editors = new dojox.collections.Dictionary();
dojo.forEach(cells, function(col){
var editor = null;
var e = col.dynamic;
if (e && e[def] && e[def].type){
editor = new e[def].type(dojo.mixin({}, inCell, e[def].properties));
} else {
editor = new dojox.grid.editors.Base(inCell);
}
editors.add(col.name, editor);
});
this.editors = editors;
},
_getCurrentEditor: function(inRowIndex){
// get the related column to determine which editor to display (in my case it depends on value in another column
var selectedColumnName = this.model.getDatum(inRowIndex, this.propertyCellIndex);
var editor = this.editors.item(selectedColumnName);
if (editor) {
return editor;
}
console.error("Editor does not exists returning the default one.")
return new dojox.grid.editors.Base(this.cell);
},
// all the rest methods looks like this one:
format: function(inDatum, inRowIndex){
return this._getCurrentEditor(inRowIndex).format(inDatum, inRowIndex);
},
...
The columns definition requires additional "dynamic" field with "editor" property.
The "editor" property defines one of standard editors.
and here is the hack (when creating the grid):
var columns = [
{
name: 'float',
field: 'floatData',
dynamic: {
editor: { type: dojox.grid.editors.Input}
}
},
{
name: 'columnName',
field: 'columnField',
dynamic: {
editor: {
type: dojox.grid.editors.Select,
properties: {
options: ["option value 1", "option 2", "option last"]
}
}
}];
// create grid:
var grid = new dojox.Grid({
model: model,
structure: structure
});
// attach grid to dom node:
...
// HACK the editor:
var valueInGrid = this.gridWidget.layout.cells[3];
if (valueInGrid.editor){
delete valueInGrid.editor;
}
valueInGrid.editor = new my.grid.editors.Dynamic(valueInGrid, /*colIndex*/0, columns, "editor");
grid.startup();
In the first column of my grid I have select input where user selects one of the column from "columns",
and then column.dynamic.editor property is used to display appropriate editor (this is handled by
_getCurrentEditor(...) method basing on value in related column).
I hope it helps someone :)
If you find better solution please let me know!
Regards
Maciej Pestka