EXTJS 禁用 checkcolumn 中的復選框

Question

我想根據其他列的值禁用行的特定復選框。

我在這里查看了問題。但是這里的所有答案都只是修改了 css。

我不想要更新的 css 。 我想實際上禁用單擊復選框。

有沒有辦法實現這一目標？

Answer 1

你也可以這樣
檢查小提琴：
https://fiddle.sencha.com/#view/editor&fiddle/1maa

    var userStore = Ext.create('Ext.data.Store', {
    data: [{
        "id": 1,
        "abbr": "AL",
        "name": "Alabama",
        "completed":false
    }, {
        "id": 2,
        "abbr": "AK",
        "name": "Alaska",
        "completed":false
    }, {
        "id": 3,
        "abbr": "AZ",
        "name": "Arizona",
        "completed":false
    }]
});

Ext.create('Ext.grid.Panel', {
    renderTo: document.body,
    store: userStore,
    width: 400,
    height: 200,
    title: 'Application Users',
    columns: [{
        width: 25,
        align: 'left',
        xtype: 'checkcolumn',
        tdCls: 'checkBoxColum',
        dataIndex: 'completed',
        renderer: function (value, meta, record, row, col) {
            /* Permission Check */
            var me = this;

            if(record.data.id==1)
            {
                meta['tdCls'] = 'x-item-disabled';
            }else
            {
                meta['tdCls'] = '';
            }
            return new Ext.ux.CheckColumn().renderer(value);
        }
    }, {
        text: 'name',
        width: 100,
        sortable: false,
        hideable: false,
        dataIndex: 'name'
    }]
});

Answer 2

檢查這個小提琴

https://fiddle.sencha.com/#view/editor&fiddle/1l26

我已經完成了使用編輯器復選框和checkcolumn的操作。

Answer 3

我的 ExtJS 4 解決方案

{
   xtype: 'checkcolumn',
   dataIndex: 'Check',
   width: 30,
   renderer: function (value, metaData, record) {
       return record.get('isDisabled') ? '' :
              (new Ext.grid.column.CheckColumn()).renderer(value);
   }
}