EXTJS disable checkbox in checkcolumn

Question

I want to disable a particular checkbox for a row depending on values for other column.

I looked at the question here .But all the answers here just modify the css .

I don't want just the updated css . I want to actually disable the checkbox for clicking.

Is there any way to achieve this?

score 6 · Answer 1 · answered Dec 12 '16 at 09:53

you can do like this way also
check fiddle :
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'
    }]
});

You have done this for extjs 6.2.1. I tried with extjs 4.1 .This solution does not work for it. — Aditya Korti, Dec 12 '16 at 10:25
@AdityaKorti In Ext 4, Ext.ux.CheckColumn is an extension that does not include with Ext framework. — Ajay Thakur, Dec 13 '16 at 10:09
@AdityaKorti please check this link for more information https://www.sencha.com/forum/showthread.php?243045-grid-with-checkcolumn — Ajay Thakur, Dec 13 '16 at 10:11

score 0 · Answer 2 · answered Dec 12 '16 at 11:16

0

Check this fiddle

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

I have done this using editor check box along with checkcolumn.

answered Dec 12 '16 at 11:16

Surya Prakash Tumma

2,153
4
27
47

You have just disabled editing altogether for checkbox. I want to disable only few of them – Aditya Korti Dec 12 '16 at 11:29
Write a condition in the listener beforecheckchange – Surya Prakash Tumma Dec 12 '16 at 11:31
Condition does not really matter, Anyway I got a different idea from whatever you did. – Aditya Korti Dec 12 '16 at 11:34

V.Tur · Answer 3 · 2022-08-16T08:43:05.750

0

My solution for ExtJS 4

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

Need to add next settings to grid:

selModel: Ext.create('Ext.selection.CellModel', {
    mode: 'SIMPLE'
}),

edited Aug 16 '22 at 08:43

answered Oct 29 '21 at 09:09

V.Tur

1,115
9
20

EXTJS disable checkbox in checkcolumn

3 Answers3