WebHierarchicalDataGrid™ でセル値を編集することはクライアント側のみに限られています。そのセルへの参照を取得し、その設定値メソッドを呼び出すことによってセルの値を編集できます。
サーバー側で、セル値は読み取り専用です。ただし、データ検証などの操作のための値を取得することができます。サーバー側とクライアント側の両方でセルの値を取得できます。
以下のコードは WebHierarchicalDataGrid のセル値を取得および編集する方法を示します。
注： プログラムでセルを編集するために EditingCore 動作を有効にし、その EnableInheritance プロパティを True に設定する必要があります。
Visual Basic の場合：
' RowIslandDataBound イベントを接続します
AddHandler Me.WebHierarchicalDataGrid1.RowIslandDataBound, AddressOf WebHierarchicalDataGrid1_RowIslandDataBound
Protected Sub WebHierarchicalDataGrid1_RowIslandDataBound(ByVal sender As Object, ByVal e As RowIslandEventArgs) Handles WebHierarchicalDataGrid1.RowIslandDataBound
If e.RowIsland.DataMember = "SqlDataSource1_DefaultView" Then
' 親セル値にアクセスします
Dim cellValue As String = e.RowIsland.Rows(0).Items(1).Value.ToString()
End If
End Sub
C# の場合：
// RowIslandDataBound イベントを接続します
this.WebHierarchicalDataGrid1.RowIslandDataBound += new RowIslandEventHandler(WebHierarchicalDataGrid1_RowIslandDataBound);
protected void WebHierarchicalDataGrid1_RowIslandDataBound(object sender, RowIslandEventArgs e)
{
if(e.RowIsland.DataMember == "SqlDataSource1_DefaultView")
{
// 親セル値にアクセスします
string cellValue = e.RowIsland.Rows[0].Items[1].Value.ToString();
}
}
JavaScript の場合：
var grid = $find("WebHierarchicalDataGrid1");
var parentGrid = grid.get_gridView();
// 親セル値を取得および設定します
var oldvalue = parentGrid.get_rows().get_row(0).get_cell(1).get_value(); parentGrid.get_rows().get_row(0).get_cell(1).set_value("new string value");
// 子セル値を取得および設定します
var childGrid = grid.get_gridView().get_rows().get_row(0).get_rowIslands(0)[0];
var oldValue = childGrid.get_rows().get_row(0).get_cell(1).get_value();
childGrid.get_rows().get_row(0).get_cell(1).set_value("NewChildValue");
WebHierarchicalDataGrid でデータ編集を有効にするには、 CellEditing 動作を Behaviors コレクションに追加します。CellEditing 動作の EditModeActions プロパティによって、どのアクションによってセルが編集モードになるのかを決定することができます。
RowUpdating イベントを処理した場合には、編集された行でフォーカスを失うと変更が直ちにデータ ソースにコミットします。行がフォーカスを取得またはフォーカスを失うには、Activation 動作を有効にする必要があります。Activation 動作の詳細は、 「アクティブ化」トピックを参照してください。
注： この種類の自動的な更新に対してサポートされるデータ ソースを発生させる必要があります。データ ソースが WebHierarchicalDataGrid によって自動的に更新できない場合、更新イベントを処理してデータを手動で更新する必要があります。
WebHierarchicalDataGrid で CellEditing 動作を有効にするために、次の手順を実行します。
WebHierarchicalDataGrid を WebHierarchicalDataSource™ コンポーネントにバインドし、Categories および Products テーブルからデータを取得します。この詳細は、 階層的なデータ ソースにバインドトピックを参照してください。
Microsoft® Visual Studio [プロパティ] ウィンドウで、Behaviors プロパティを指定して、省略記号 (…) ボタンをクリックし、[動作エディター] ダイアログを起動します。
動作を有効にするために左側の動作のリストのセルの編集の隣のチェックボックスをチェックします。 EditingCore 動作も追加されていることに注意してください。
EditingCore およびセルの編集動作の EnableInheritance プロパティを True に設定します。これによって、すべての子レベルでセルの編集動作が自動的に継承されます。このプロパティのデフォルト値は False です。
EditModeActions プロパティの下の Cell Editing プロパティ セクションで、 MouseClick プロパティを Single に設定します。これはシングル クリックでセルが編集モードになるように指定します。デフォルトはダブルクリックです。
[適用]、そして [OK] をクリックします。
WebHierarchicalDataGrid のプロパティ ウィンドウのイベント表示に移動して、RowUpdating イベントを処理します。コードをイベント ハンドラに追加する必要はありません。
WebHierarchicalDataGrid のプロパティ ウィンドウで EnableAjax が True であることをチェックします。そうでない場合は、True に設定します。
アプリケーションを実行します。セルをクリックすると、セルは編集モードになりデータを変更できます。編集したばかりのセルをクリックして放すと、AJAX を介してデータ ソースに変更がコミットされます。