SMART datagrid v.1 > Examples

Back  Forward

Row Updating  Example  準備中...

データ行を修正する方法はいろいろあるが、 今回のサンプルではユーザーの入力で既存の行の値たちを変更する方法について説明する。 SMART datagridのグリッド内の編集機能を活用すれば既存デスクトップに似たユーザーの入力UIを具現することができる。 

ユーザーが直接データセルを編集して行を修正するためには、まず GridBase.editOptionsreadOnlyfalseupdatabletrue(すべてデフォルト値)に設定すべきである。 編集しようとする行のデータセルにフォーカスを移して、 F2キーを入力してエディターを先に表示させるか、選択した後直にテキストキーで入力を始めればセルの編集がはじまる。 

編集の後、行の修正を完了するためには上下の方向キーを打つか、マウスで他の行を選択すればいい。 また、Escキーを打てば編集を取消できる。 行の修正が始まればrow indicatorセルに修正のマークが表示され、 編集を完了して実際に行の修正になるとrow indicatorの状態セルの色が変わる。 

Grid - 1
rows

行の修正が完了すればデータセットのonRowUpdatedイベントが発生する。 データ行の修正が始まる前にonRowUpdatingイベントが発生するが、 このイベントハンドラーの内で明示的にfalseをリターンすれば行の修正が取消になる。 

また、グリッド並みで行の修正を始めることができないようにすることもできる。 グリッドのonUpdatingイベントハンドラー内で明示的にfalseをリターンすれば修正が始められない。 

 

 

Code -1
    grdMain.onUpdating = function (grid, rowIndex) {
        if ($('#chkEventUpdatable').is(':checked')) {
            return false;
        } 
    };

ユーザーの入力の代わりGridBase.editを呼び出して行の修正を始めることもできる。  

ソースを見る 

See Also
EditOptions
RowIndicator
GridBase.editOptions
GridBase.rowIndicator
GridDataSet.onRowUpdated
GridBase.onRowUpdating
GridBase.edit
GridBase.showEditor