Is this content useful?
Thank you for your feedback!
Thank you for your feedback! You have rated this topic in the last 30 days.
行編集の概要
トピックの概要
目的
このトピックでは、 WebDataGrid ™ の行編集動作の機能の概要を提供します。
前提条件
このトピックをより理解するために、以下のトピックを参照することをお勧めします。
| トピック |
目的 |
|
このトピックは、 WebDataGrid の動作を説明します。
|
|
このトピックでは、 WebDataGrid の編集機能 (EditingCore 動作) の概要を提供します。
|
はじめに
行編集の概要
行編集動作は、 WebDataGrid 編集モードが向上された機能です。ユーザーに高い編集エクスペリエンスを提供します。行編集を使用すると、編集中の行はすべてのセルにエディターを表示します。編集中の行にダイアログで [完了] および [キャンセル] ボタンは表示されます。このボタンは、保留中の編集を保存するか、キャンセルします。
デフォルトで、行編集は無効に設定されています。 WebDataGrid デザイナー、ASPX マークアップ、またはコード ビハインドで有効できます。詳細は、「 行編集の有効化 」トピックを参照してください。
主要機能
主要な機能の概要表
以下の表で、 WebDataGrid の行編集の動作の主要な機能を簡単に説明します。
| 機能 |
説明 |
|
セル編集の動作と異なり、行編集動作はグリッド行の全体を編集モードに入れます。ユーザーは編集モードにある行を簡単に識別できます。
|
|
このボタンは、編集モードにある行の下のダイアログに表示されます。グリッド コンテナーの右側に相対して配置され、垂直スクロールでこの位置から移動しません。編集中の行の変更を保存するか、キャンセルする方法を提供します。
|
ユーザー インタラクションと操作性
ユーザー インタラクションの概要表
以下の表で、 WebDataGrid の行編集の動作のユーザー インタラクション機能を簡単に説明します。
| 目的 |
方法 |
詳細 |
構成方法 |
|
|
デフォルトで、行編集はダブルクリックまたはダブル タップで編集モードを開始します。
|
|
|
-
クリックまたはタップ
-
[完了] ボタン
-
Enter キー
|
デフォルトで、ユーザーが編集中以外の行をクリックするか、タップすると、編集中の行の変更を保存し、行が編集モードを終了します。
[完了] ボタンをクリックするか、キーボードの Enter キーを押すと、編集モードで行の変更を保存し、編集モードを終了します。
|
|
|
|
[キャンセル] ボタンをクリックするか、キーボードの Esc キーを押すと、編集モードで行の変更をキャンセルし、編集モードを終了します。
|
[完了] および [キャンセル] ボタンのダイアログは、編集動作の EnableDialog プロパティによって非表示できます。
|
行編集動作のイベント
行編集の動作イベント参照
行編集の動作は、クライアント側の機能をカスタマイズするために使用される以下のクライアント側イベントがあります。このイベントは、イベント引数によってセル値へのアクセスを提供します。
| イベント |
説明 |
|
行が編集モードに入る前に発生します。このイベントはキャンセル可能です。
|
|
|
|
行が編集モードを終了する前に発生します。2 つの方法によってキャンセルできます。eventArgs.keepEditing(true) を使用して行が編集モードの終了を回避するか、eventArgs.set_cancel(true) を使用して編集モードを終了し、変更をキャンセルします。
|
|
|
関連コンテンツ
トピック
このトピックの追加情報については、以下のトピックも合わせてご参照ください。
| トピック |
目的 |
|
このトピックは、 WebDataGrid で行編集動作を有効にする方法を説明します。
|
サンプル
このトピックについては、以下のサンプルも参照してください。
| サンプル |
目的 |
|
このサンプルでは、[完了]/[キャンセル] ボタンを使用する行編集動作を表示し、編集中の行の各セルにエディターを表示します。
|
|
このサンプルでは、[完了]/[キャンセル] ボタンを非表示、またはボタンのカスタム HTML および CSS クラスを提供して、行編集動作の外観をカスタマイズできます。
|
|
このサンプルでは、行編集動作をカスタマイズするために EnteringEditMode および ExitingEditMode イベントを使用する方法を紹介します。
|
_1.png)
