确认框点击No按钮，取消选中Grid复选框单元格ExtJs

Question

在 Grid 中，如果在确认框中单击 'No' 按钮，我想取消选中该复选框，我正在尝试通过设置 checked false。它不工作。

Ext.create('Ext.grid.Panel', {   
columns  : [  
 {
        xtype: 'checkcolumn',
        id: 'device',
        text: 'Device',
        dataIndex: 'device',
        checkboxToggle: true,
        hidden: false,
        action: "checkchange"
} ]
});

动作在控制器文件中定义

'Grid [action=checkchange]' {
    checkchange: function (column, rowIndex) {
      if (checked == true) {
                    Ext.MessageBox.confirm({
                        cls: 'window-alert',
                        buttons: Ext.Msg.YESNO,
                        msg: 'Are you sure?',
                        fn: function (btn) {
                            if (btn === 'yes') {

                            } else {
                                var grid = column.up('Grid');
                                var gridStore = grid.getStore();
                                var rec = gridStore.getAt(rowIndex);
                               rec.get('device').checked = false;  
                            }
                        }
                    });
                }    
            }
        }
    });
}

Answer 1

Try to use listeners for checkchange of checkcolumn

我创建了一个演示，它是如何在 ExtJs4.2 中工作的，您可以在此处查看 Sencha Fiddle

希望能帮到您解决问题。

var store = Ext.create('Ext.data.Store', {
        fields: ['name', 'email', 'phone', {
            name: 'isChecked',
            type: 'boolean',
            defaultValue: false
        }],
        data: [{
            name: 'Lisa',
            email: 'lisa@simpsons.com',
            phone: '555-111-1224'
        }, {
            name: 'Bart',
            email: 'bart@simpsons.com',
            phone: '555-222-1234'
        }, {
            name: 'Homer',
            email: 'homer@simpsons.com',
            phone: '555-222-1244'
        }, {
            name: 'Marge',
            email: 'marge@simpsons.com',
            phone: '555-222-1254'
        }]
    });

    Ext.create('Ext.grid.Panel', {
        title: 'Simpsons',
        store: store,
        columns: [{
            xtype: 'checkcolumn',
            width: 30,
            sortable: false,
            dataIndex: 'isChecked',
            editor: {
                xtype: 'checkbox',
                cls: 'x-grid-checkheader-editor'
            },
            listeners: {
                checkchange: function (column, rowIndex, checked, record, e, eOpts) {
                    if (checked) {
                        Ext.MessageBox.confirm({
                            cls: 'window-alert',
                            buttons: Ext.Msg.YESNO,
                            msg: 'Are you sure?',
                            fn: function (btn) {
                                if (btn === 'yes') {
                                    column.up('grid').getSelectionModel().select(record, true, true)
                                } else {
                                    column.up('grid').getStore().getAt(rowIndex).set('isChecked', false);
                                }
                            }
                        });
                    }
                }
            }
        }, {
            text: 'Name',
            dataIndex: 'name'
        }, {
            text: 'Email',
            dataIndex: 'email',
            flex: 1
        }, {
            text: 'Phone',
            dataIndex: 'phone'
        }],
        height: 500,
        width: '100%',
        renderTo: Ext.getBody()
    });

确认框点击No按钮，取消选中Grid复选框单元格ExtJs

Confirmation box click No button, uncheck the Grid check box cell ExtJs

javascript

grid

extjs

sencha-touch