Question

我的表单中有一个带CheckboxSelectionModel的网格面板。我正在使用ExtJs 3.4。这是我的网格面板。

var selectModel = new Ext.grid.CheckboxSelectionModel();

var drop_pick_grid = new Ext.grid.GridPanel({
store : dropPickGridStore,
cm : new Ext.grid.ColumnModel([ selectModel, {
    sortable : true,
    header : "Drop/Pick Loc",
    dataIndex : 'locationName',
    width : 170,
    renderer : function(value, metaData, record, rowIndex,
            colIndex, store) {
        var refColor = record.data.tourTypeColor;
        //console.log(record);
        metaData.attr = 'style="background-color:' + refColor + ';"';
        return record.get('locationName');
    }
}, {
    header : "Town/City",
    sortable : true,
    dataIndex : 'city',
    width : 120
}, {
    header : "Address",
    sortable : true,
    dataIndex : 'addr',
    width : 170
}, {
    header : "EST.Un/Load Time",
    sortable : true,
    dataIndex : 'estimatedTime',
    width : 100
} ]),
sm : new Ext.grid.CheckboxSelectionModel(),
//width : 570,
//height : 390,
autoHeight : true,
autoWidth : true,
frame : true,
iconCls : 'icon-grid',
renderTo : document.body
});

使用Json从postgresql数据库加载此网格。

var dropPickGridStore = new Ext.data.JsonStore({
fields : [ {
    name : 'locationCode'
}, {
    name : 'locationName'
}, {
    name : 'city'
}, {
    name : 'addr'
}, {
    name : 'estimatedTime'
}, {
    name : 'tourTypeColor'
} ],
root : 'dropPickLoc',
idProperty : 'locationCode',
//autoDestroy : true,
autoLoad : true,

proxy : new Ext.data.HttpProxy({
    url : "http://" + host + ":" + port + "/" + projectName + "/"
            + "PendingDropPicks"

}),
reader : {
    type : 'json',
    root : 'dropPickLoc'
    //idProperty : 'locationName',
},
});

网格已成功加载。问题是我无法检查网格中的复选框，但它可以通过单击标题复选框来选择所有行。为什么它不能分别检查每一行。

Answer 1

您必须在columns和selModel配置中使用相同的选择模型对象。在这里，您要创建两个不同的Ext.grid.CheckboxSelectionModel实例。

替换此行：

sm: new Ext.grid.CheckboxSelectionModel(),

有了这个：

sm: selectModel,

ExtJs中的CheckboxSelectionModel网格：无法在网格面板中选中复选框，选中标题时将检查所有行复选框

1 个答案: