View Full Version : Row Editor with CheckColumn as plugin

28 Nov 2009, 1:47 AM
Hi all

I have a grid panel like the obe in the Row Editor example with a checkbox column. In the Row Editor example the text 'yes' and 'no' are shown when the row ist not in editing mode.

Now want tho have the same behavior like in Edit Grid example and display a checkbox in the not-edit mode.

I have tried with folloin code:

var editor = new Ext.ux.grid.RowEditor({
saveText: 'Update'

var checkColumn = new Ext.grid.CheckColumn({
xtype: 'booleancolumn',
header: 'Active',
dataIndex: 'active',
align: 'center',
width: 50,
trueText: 'Yes',
falseText: 'No',
editor: {
xtype: 'checkbox'

var grid = new Ext.grid.GridPanel({
store: store,
width: 600,
margins: '0 5 5 5',
autoExpandColumn: 'name',
plugins: [editor, checkColumn],
view: new Ext.grid.GroupingView({
markDirty: false
tbar: [{
... some code...

columns: [
new Ext.grid.RowNumberer(),
id: 'name',
header: 'First Name',
dataIndex: 'name',
width: 220,
sortable: true,
editor: {
xtype: 'textfield',
allowBlank: false
}, ... some other columns ...

}, checkColumn

But it does not work a I recieve following error message:

Ext.grid.CheckColumn is not a constructor
[Break on this error] xtype: 'checkbox'\n

Any ideas.

Thanks for your replies

28 Nov 2009, 10:55 AM
Do not use a CheckColumn with a RowEditor.

Instead, use a normal column with an Ext.form.Checkbox editor and only the renderer from Ext.ux.form.CheckColumn.

ps. Did you actually include the examples/ux/CheckColumn.js file?

29 Nov 2009, 1:05 AM
The ChckColumn as renderer did not work (i've included de .js file).

But when I use my own function as renderer it works fine:

renderer: formatBoolean,
editor: { xtype: 'checkbox' }";

function formatBoolean(aValue, aMetadata, aRecord, aRowInderx, aColIndex, aStore){
aMetadata.css += ' x-grid3-check-col-td';
return '<div class="x-grid3-check-col' + (aValue != null && aValue == true ? '-on' : '') + '"> </div>';

29 Nov 2009, 2:25 PM
Correct, you also could have used:

renderer: Ext.ux.grid.CheckColumn.prototype.renderer