extjs grid 单元格 多选

new Ext.grid.CellSelectionModel({
last : false, // 上一次选中的单元格
selections : [], // 选择区缓存
handleMouseDown: function (grid, row, col, event) {
var isSelected;
if (event.button !== 0 || this.isLocked())
return;
if (event.shiftKey && this.last !== false) { //是否按下shift
this.selectMatrix(row, col);
grid.getView().focusCell(row, col);
return;
} else if (event.ctrlKey) { //是否按下ctrl
isSelected = this.isSelected(row, col);
if (col === 0 && this.last[1] === 0) {
isSelected ? this.deselectRow(row) : this.selectRow(row, true);
}
if (isSelected) { // 是否已被选中，是则反选，否则选中
this.deselectCell(row, col);
} else {
this.selectCell(row, col, true);
this.last = [row, col];
}
} else if (col === 0) { // 第一列是NumberColumn 点击则选择列
this.selectRow(row);
this.last = [row, col];
} else { // 选择单个单元格
this.selectCell(row, col);
this.last = [row, col];
}
if (this.matrix)
delete this.matrix;
},
// 清除选择区内所以单元格被选中的样式
clearCellSelections: function () {
var l = this.selections.length,
i = 0;
for (; i < l; i++) {
cell = this.selections[i];
this.grid.view.onCellDeselect(cell[0], cell[1]); // GridView的内置方法，改变某单元格样式
}
this.selections.length = 0;
},
// 反选指定单元格，并清除相应选择区缓存
deselectCell: function (row, col, isDelrow) {
var l = this.selections.length,
i = 0, n = 0;
if (this.selections) {
this.grid.view.onCellDeselect(row, col); // GridView的内置方法，改变某单元格样式
for (; i < l; i++) {
cell = this.selections[i];
if (row !== cell[0] || col !== cell[1]) {
this.selections[n++] = this.selections[i];
} else if (!isDelrow) { // 是否删除行
this.selections.splice(i, 1);
return;
}
}
this.selections.length = n;
}
},
// 根据选择区缓存中的数据，判断是否被选中
isSelected: function (row, col) {
var l = this.selections.length,
i = 0;
for (; i < l; i++) {
cell = this.selections[i];
if (row === cell[0] && col === cell[1]) {
return true;
}
}
return false;
},
// 选中某个单元格
selectCell: function (rowIndex, colIndex, keepExisting, preventViewNotify, preventFocus) {
if (this.fireEvent("beforecellselect", this, rowIndex, colIndex) !== false) {
if (!keepExisting)
this.clearCellSelections();
this.selections.push([rowIndex, colIndex]); // 加入选择区缓存
if (!preventViewNotify) {
var v = this.grid.getView();
v.onCellSelect(rowIndex, colIndex); // GridView的内置方法，改变某单元格样式
if (preventFocus !== true) {
v.focusCell(rowIndex, colIndex);
}
}
this.fireEvent("cellselect", this, rowIndex, colIndex);
this.fireEvent("selectionchange", this, this.selection);
}
},
// 选中某一行
selectRow: function (rowIndex, keepExisting) {
var clen = this.grid.getColumnModel().getColumnCount(),
c = 0;
if (!keepExisting)// 是否清空所有已选择的单元格
this.clearCellSelections();
for (; c < clen; c++) {
this.selectCell(rowIndex, c, true);
}
},
// 某行反选
deselectRow: function (row) {
var clen = this.grid.getColumnModel().getColumnCount(),
c = 0;
if (this.selections) {
for (; c < clen; c++) {
this.deselectCell(row, c, true);
}
}
},
// 按shift键调用的方法，选中一个矩形区域内所有的单元格
selectMatrix: function (row, col, keepExisting) {
// 以上一次被选择的单元格为起点，形成一个矩阵区域
var r = this.last[0],
c = this.last[1];
if (!keepExisting)
this.clearCellSelections();
if (r > row) {
var temp = row;
row = r;
r = temp;
}
if (col === 0 && c === 0) { // 若选择了第一列序号，则选择行
for (; r <= row; r++) {
this.selectRow(r, true);
}
return;
}
if (c > col) {
var temp = col;
col = c;
c = temp;
}
for (; r <= row; r++) {
for (var i = c; i <= col; i++) {
this.selectCell(r, i, true);
}
}
this.matrix = { // 矩形区域选择区数据
start: [r, c],
end: [row, col]
};
}
}),