Grid 取消选中 在 MultiRange 模式下的一些问题
首先是在调用 select(-1, -1) 来取消表格选中效果时，浏览器的控制台会报 期望值为正数 的错误，并且当selectedMode为MultiRange时，按住Ctrl跨行选中多个单元格后，调用 select(-1, -1)，并不能将表格的所有选中单元格取消选中本帖最后由 KevinChen 于 2020-5-15 16:48 编辑
您好，MultiRange在V2020新版本中有了原生实现，这个问题需要一些时间来调研，
大概明天中午前能够给你回复，谢谢~
——————————————————————————————————————————————
您好，这个问题已经找到解决方案，请将以下代码复制到链接示例的app.js中即可看到效果：
https://www.grapecity.com/wijmo/demos/Grid/Selection/MultipleSelection/purejs
import 'bootstrap.css';
import '@grapecity/wijmo.styles/wijmo.css';
import './styles.css';
import { glbz, isNumber, saveFile } from '@grapecity/wijmo';
import { FlexGrid, SelectionMode, CellRange } from '@grapecity/wijmo.grid';
document.readyState === 'complete' ? init() : window.onload = init;
function init() {
// create some random data
var data = [];
var countries = 'Austria,Belgium,Chile,Denmark,Finland,Japan,UK'.split(',');
for (var i = 0; i < 300; i++) {
data.push({
id: i,
from: countries,
to: countries[(i + 1) % countries.length],
sales: Math.random() * 10000,
expenses: Math.random() * 5000,
amount: Math.random() * 10000,
extra: Math.random() * 10000,
});
}
// show the data in a grid
var theGrid = new FlexGrid('#theGrid', {
alternatingRowStep: 0,
showMarquee: true,
showSelectedHeaders: 'All',
anchorCursor: true,
selectionMode: SelectionMode.MultiRange,
itemsSource: data,
// update aggregate display when selection changes
selectionChanged: (s, e) => {
// calculate aggregates
let agg = { cnt: 0, cntAll: 0, sum: 0, avg: 0, cells: {} };
s.selectedRanges.forEach(rng => {
aggregateRange(s, agg, rng);
});
// update the display using template literals
let msg = (agg.cnt > 1) ? glbz `Count: <b>${agg.cntAll}:n0</b>\tAverage: <b>${agg.avg}:g4\tSum: <b>${agg.sum}:g4</b>`
: (agg.cntAll > 1) ? glbz `Count: <b>${agg.cntAll}:n0</b>`
: 'Ready';
// update the display using wijmo.format
//let msg = (agg.cnt > 1) ? format('Count: <b>{cntAll:n0}</b>\tAverage: <b>{avg:g4}</b>\tSum: <b>{sum:g4}</b>', agg)
// : (agg.cntAll > 1) ? format('Count: <b>{cntAll:n0}</b>', agg)
// : 'Ready';
document.getElementById('mr-aggregates').innerHTML = msg;
}
});
// update aggregates for a range
function aggregateRange(grid, agg, rng) {
for (let r = rng.topRow; r <= rng.bottomRow; r++) {
for (let c = rng.leftCol; c <= rng.rightCol; c++) {
let key = r + ',' + c;
if (!agg.cells) { // account for overlapping ranges
agg.cells = true;
let data = grid.getCellData(r, c, false);
if (isNumber(data)) { // handle numbers
agg.cnt++;
agg.sum += data;
}
if (data != '' && data != null) { // handle non-empty cells
agg.cntAll++;
}
}
}
}
agg.avg = agg.cnt > 0 ? agg.sum / agg.cnt : 0;
}
// export grid or selection to CSV
document.getElementById('btn-csv-grid').addEventListener('click', () => {
var selMode = theGrid.selectionMode;
if(selMode == SelectionMode.MultiRange){
var grid = theGrid;
grid.selectedRanges.forEach(sr => {
sr.setRange(-1, -1, -1, -1);
});
grid.select(-1, -1);
grid.refresh();
}else{
theGrid.select(-1,-1);
// 另一种方法：
//theGrid.collectionView.currentItem=null;
}
});
document.getElementById('btn-csv-sel').addEventListener('click', () => {
var csv = theGrid.getClipString(null, true, true);
saveFile(csv, 'FlexGridSelection.csv');
});
}
页:
[1]