extjs - ラベルとチェックボックスを含む列を作成する方法

Question

ExtJs-4.2 を使用しています。グリッドにラベルとチェックボックスのある列を作成したい - 方法はありますか?

checkcolumn はその横にテキストを許可しないと思います。/ { xtype: 'checkcolumn', header: 'Indoor?', dataIndex: 'indoor', width: 90, stopSelection: false }, /

これを行う方法はありますか？

Answer 1

これは私にとって非常に役立ちます。

しかし、私の主な関心事は、データ ストアから取得した値を" chkLabel "に割り当てることができる checkcolumn を作成したいということです。

Answer 2

「Ext.grid.column.CheckColumn」クラスを拡張して、レンダラー関数をオーバーライドできます。簡単な例:

Ext.define('CustomCheckbox', {
    extend: 'Ext.grid.column.CheckColumn',
    xtype: 'CustomCheckbox',

    config: {
        chkLabel: ''
    },

    renderer : function(value, meta) {
        var cssPrefix = Ext.baseCSSPrefix,
            cls = [cssPrefix + 'grid-checkcolumn'];

        if (this.disabled) {
            meta.tdCls += ' ' + this.disabledCls;
        }
        if (value) {
            cls.push(cssPrefix + 'grid-checkcolumn-checked');
        }
        return '<img class="' + cls.join(' ') + '" src="' + Ext.BLANK_IMAGE_URL + '"/>' + this.chkLabel;
    }
});

これで、次のように使用できます。

{
    xtype: 'CustomCheckbox',
    dataIndex: 'complete',
    itemId: 'chkComplete',
    chkLabel: 'SOme content'
}