データ行を修正する方法はいろいろあるが、 今回のサンプルではユーザーの入力で既存の行の値たちを変更する方法について説明する。 SMART datagridのグリッド内の編集機能を活用すれば既存デスクトップに似たユーザーの入力UIを具現することができる。
ユーザーが直接データセルを編集して行を修正するためには、まず GridBase.editOptionsのreadOnlyをfalseにupdatableを true(すべてデフォルト値)に設定すべきである。 編集しようとする行のデータセルにフォーカスを移して、 F2キーを入力してエディターを先に表示させるか、選択した後直にテキストキーで入力を始めればセルの編集がはじまる。
編集の後、行の修正を完了するためには上下の方向キーを打つか、マウスで他の行を選択すればいい。 また、Escキーを打てば編集を取消できる。 行の修正が始まればrow indicatorセルに修正のマークが表示され、 編集を完了して実際に行の修正になるとrow indicatorの状態セルの色が変わる。
行の修正が完了すればデータセットのonRowUpdatedイベントが発生する。 データ行の修正が始まる前にonRowUpdatingイベントが発生するが、 このイベントハンドラーの内で明示的にfalseをリターンすれば行の修正が取消になる。
また、グリッド並みで行の修正を始めることができないようにすることもできる。 グリッドのonUpdatingイベントハンドラー内で明示的にfalseをリターンすれば修正が始められない。
grdMain.onUpdating = function (grid, rowIndex) {
if ($('#chkEventUpdatable').is(':checked')) {
return false;
}
};
ユーザーの入力の代わりGridBase.editを呼び出して行の修正を始めることもできる。