如何将复选框列添加到Extjs Grid

要将复选框列添加到ExtJS Grid，您可以使用Ext.grid.column.CheckColumn类。以下是一个简单的示例，说明如何将复选框列添加到ExtJS Grid中：

首先，确保您已经包含了ExtJS库的引用。
在您的JavaScript代码中，创建一个Ext.grid.column.CheckColumn实例，并将其添加到Ext.grid.Panel的columns配置中。

Ext.create('Ext.grid.Panel', {
    title: 'My Checkbox Grid',
    store: myStore,
    columns: [
        // 添加复选框列
        {
            xtype: 'checkcolumn',
            header: 'Selected',
            dataIndex: 'selected',
            width: 100
        },
        // 其他列配置
        {
            text: 'Name',
            dataIndex: 'name',
            flex: 1
        },
        {
            text: 'Email',
            dataIndex: 'email',
            flex: 1
        }
    ],
    renderTo: Ext.getBody()
});

在这个示例中，我们创建了一个Ext.grid.Panel实例，并添加了一个Ext.grid.column.CheckColumn实例。我们还定义了两个其他列：Name和Email。

确保您的数据存储包含一个selected字段，以便复选框列可以正确显示和更新数据。

var myStore = Ext.create('Ext.data.Store', {
    fields: [
        { name: 'name', type: 'string' },
        { name: 'email', type: 'string' },
        { name: 'selected', type: 'boolean' }
    ],
    data: [
        { name: 'John Doe', email: 'john.doe@example.com', selected: false },
        { name: 'Jane Doe', email: 'jane.doe@example.com', selected: false },
        // 更多数据
    ]
});

在这个示例中，我们创建了一个Ext.data.Store实例，并定义了三个字段：name、email和selected。selected字段的类型为boolean，这样复选框列可以正确显示和更新数据。

现在，您应该已经成功地将复选框列添加到了ExtJS Grid中。用户可以通过单击复选框来选择或取消选择行，并且selected字段将自动更新以反映当前状态。