Peter Kellner
Peter Kellner

Reputation: 15508

Using ExtJS4, any easy way to deal with a checkbox in a grid panel?

I've written a bulky renderer that feels like it could be simpler. I'm wanting two way binding to a checkbox (from the store). below is what I've done which just feels wrong, but I can't find another way to do it.

columns: [
    { header: 'PresidentNumber', dataIndex: 'PresidentNumber', flex: 1 },
    { header: 'FirstName', dataIndex: 'FirstName', sortable: true, flex: 1 },
    { header: 'LastName', dataIndex: 'LastName', sortable: true, flex: 1 }, {
        header: 'TookOffice',
        dataIndex: 'TookOffice',
        renderer: Ext.util.Format.dateRenderer('m/d/Y')
    }, {
        header: 'LeftOffice',
        dataIndex: 'LeftOffice',
        renderer: Ext.util.Format.dateRenderer('m/d/Y'),
        flex: 1
    }, {
        header: 'Impeached',
        dataIndex: 'Impeached',
        flex: 1,
        renderer: function (value, cell) {
            if (value) {
                return '<input type="checkbox" name="mycheckbox" checked="checked" />';
            }
            else {
                return '<input type="checkbox" name="mycheckbox"  />';
            }
        }
    },
    { header: 'Income', dataIndex: 'Income', flex: 1, renderer: Ext.util.Format.usMoney }
]

Upvotes: 0

Views: 595

Answers (1)

Scott A
Scott A

Reputation: 7844

There is a user extension called CheckColumn (located in examples/ux/CheckColumn.js) with an xtype of "checkcolumn".

    {
       xtype: 'checkcolumn',
       header: 'Impeached',
       dataIndex: 'Impeached',
       flex: 1
    }

Upvotes: 2

Related Questions