编辑器网格Extjs中的复选框

时间:2018-03-03 20:22:05

标签: javascript checkbox extjs grid boolean

我有这段代码:

{                    
     xtype: 'checkcolumn',
     header: 'Contacto de Emergencia',
     dataIndex: 'contactoEmergencia',
     listeners: {
           beforecheckchange: function() {
                return false;
           }
     },
     width: 60,
     editor: {
         xtype: 'checkbox',
         cls: 'x-grid-checkheader-editor',
         inputValue: 1,
         uncheckedValue: 0                
     }   
}

我希望它发送1/0而不是true / false但它仍然发送true-false,我如何更改它以发送我想要的值?

1 个答案:

答案 0 :(得分:1)

您可以尝试以下代码: -

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

Ext.create('Ext.grid.Panel', {
    title: 'Simpsons',
    height: 200,
    width: 400,
    renderTo: Ext.getBody(),
    store: store,
    columns: [{
        text: 'Name',
        dataIndex: 'name'
    }, {
        text: 'Email',
        dataIndex: 'email',
        flex: 1
    }, {
        text: 'Phone',
        dataIndex: 'phone'
    }, {
        editor: {
            xtype: 'checkbox',
            cls: 'x-grid-checkheader-editor',
            inputValue: 1,
            uncheckedValue: 0
        },
        text: 'Active',
        dataIndex: 'active',
        renderer: function(value, metadata, record, rowIndex, colIndex, store) {
            var tempVal = '',
                me = this;
            if (value === 1) {
                tempVal = 'checked';
            }
            return "<input name=" + record.get('id') + "_" + record.get('id') + " type='checkbox'" + tempVal + ">";
        }
    }],
    listeners: {
        cellclick: function(grid, td, cellIndex, record, tr, rowIndex, e, eOpts) {
            console.log(e);
            if (e.target.type && e.target.type === 'checkbox') {
                let checkVal = e.target.checked ? 1 : 0;
                record.set('active', checkVal);
                console.log(record);
            }
        }
    }
});

您也可以查看fiddle 在控制台上,您可以查看更新的记录。

希望有所帮助:)