基本的にユーザーはデータセルの領域をマウスでドラッグして指定した領域を選択状態に指定することができる。 その時、DisplayOptions.selectStyleで指定された選択スタイルによって選択の領域が指定される。
Total = 0
RowIndicator.selectableがtrueならユーザーはRowIndicator領域をマウスでドラッグして行の選択ができる。
GridHeader.selectableがtrueなら、ctrlキーを押したままカラムヘッダーの領域をドラッグすればカラムの選択ができる。
また、ユーザーはshiftキーを押したまま方向キーを利用して選択の領域を変更することができる。
マウスやキーボードでセルや行の選択中にはGridBase.onSelectionResized, GridBase.onSelectionChangedイベントが発生し、 選択が完了したらGridBase.onSelectionEndedイベントが発生する。
現在選択された行達はgetSelectedRowIndicesでわかることができて、 選択アイテムはgetSelectionで持ってくることができる。
grdMain.onSelectionEnded = function (grid) {
var rows = grid.getSelectedRows();
var fld = dsMain.getFieldIndex('salary');
var sum = 0;
for (var i = rows.length; i--;) {
var r = grid.getRow(rows[i]).dataIndex();
if (r >= 0) {
sum += dataSet.getValue(r, fld);
}
}
$('#salaryTotal').val(sum);
};
SelectionItemの説明で選択の領域についての詳しい説明を参考する。