_1.png)
このトピックは、 WebHierarchicalDataGrid ™ で行編集動作を有効にする方法を説明します。
このトピックをより理解するために、以下のトピックを参照することをお勧めします。
このトピックは、以下のセクションで構成されます。
デフォルトで、行編集は無効に設定されています。 WebHierarchicalDataGrid デザイナー、ASPX マークアップ、またはコード ビハインドで有効できます。以下で詳細を説明します。
以下の表は、 WebHierarchicalDataGrid の行編集を有効にする方法の概要を提供します。詳細手順は表の下に説明されます。
WebHierarchicalDataGrid のスマート タグからデザイナーを起動し、行の編集および編集コアの動作を有効にします。
Web フォームに ASPX マークアップを追加し、行の編集および編集コアの動作を有効にします。
コード ビハインドで作成し、行の編集および編集コアの動作を有効にします。
この例は、 WebHierarchicalDataGrid コントロールのデザイナーで行の編集および編集コアの動作を有効にします。
以下のスクリーンショットは最終結果のプレビューです。
この手順を実行するには、以下が必要です。
ASP.NET Visual Studio® web サイトまたは web アプリケーション
Web フォームに追加した ScriptManager または WebScriptManager™
階層データ ソースにバインドされた WebHierarchicalDataGrid 。
以下はプロセスの概要です。
1.バンドの動作オプションにアクセス
2.特定のバンドで行編集の有効化
3. (オプション) * すべてのバンドで行編集の有効化*
4. (オプション) * 結果の検証*
以下の手順では、デザイナーで行編集を有効にする方法を示します。
WebHierarchicalDataGrid のスマート タグを開きます。
ASPX ページのデザイナーでスマート タブ ボタンをクリックすると、 WebHierarchicalDataGrid のデザイナーを開きます。
image::images/Enabling_Row_Editing_(WebHierarchicalDataGrid)_2.png[] 2.「バンドの編集」リンクをクリックします。
利用可能なバンドを編集するためのデザイナーを開きます。
_3.png)
1.動作のデザイナーを開きます。
親バンドを選択し、ツリーの「動作」ノードを展開します。Behaviors プロパティを選択し、省略記号 […] ボタンをクリックします。
注: 特定のバンドを選択すると、そのバンドのみに行編集動作を有効できます。
image::images/Enabling_Row_Editing_(WebHierarchicalDataGrid)_4.png[] 2.行編集の動作を選択します。
行編集の動作の隣のチェックボックスを選択します。このチェックボックスをクリックすると、編集コアの動作も有効にします。
1.バンドのデザイナーを開きます。
ASPX ページのデザイナーでスマート タブ ボタンの「バンドの編集」リンクをクリックすると、 WebHierarchicalDataGrid のデザイナーを開きます。
image::images/Enabling_Row_Editing_(WebHierarchicalDataGrid)_3.png[] 2.EditingCore および行編集動作で継承を有効にします。
親データ ビューが選択されていることを確認します。この場合、 SqlDataSource1_DefaultView と呼ばれます。プロパティ グリッドで EditingCore および RowEditing 動作の EnableInheritance プロパティを設定します。
_6.png)
3.デザイナーを閉じます。
結果を検証するために、MVC プロジェクトを実行します。結果を検証するために、 プロジェクトを実行します。親バンドおよびすべての子バンドの行を編集できます。
Web フォームに ASPX マークアップを追加し、行の編集および編集コアの動作を有効にします。このマークアップは、デザイナーの使用で生成されたマークアップと同じです。(WebHierarchicalDataGrid デザイナーで行編集の有効化を参照してください。)行編集の動作は EditingCore の動作が必要ため、その動作も追加します。
以下のスクリーンショットは最終結果のプレビューです。
この手順を実行するには、以下が必要です。
ASP.NET Visual Studio web サイトまたは web アプリケーション
階層データ ソースにバインドされた WebHierarchicalDataGrid 。
プロジェクトに含まれ、 web.config ファイルで構成された ig_res フォルダーおよびスタイルセット
フォームで Infragistics.Web.UI および Infragistics.Web.UI.GridControls 名前空間を ig タグ プレフィックスと登録します
以下はプロセスの概要です。
1.ASPX マークアップで親グリッドの行編集を有効にします。
2. (オプション) 子バンドで行編集を有効にします。
3. (オプション) すべてのバンドで行編集を有効にします。
4. (オプション) * 結果を検証します。*
以下の手順では、ASPX マークアップで行編集の動作を有効にする方法を示します。
1.EditingCore 動作を WebHierarchicalDataGrid の動作コレクションに追加します。
Behaviors タグは WebHierarchicalDataGrid タグの中に追加します。その他の動作が定義された場合、EditingCore 動作は Behaviors タグで動作の兄弟として追加されます。
ASPX の場合:
<ig:WebHierarchicalDataGrid ID="WebHierarchicalDataGrid1" runat="server">
<Behaviors>
<ig:EditingCore>
</ig:EditingCore>
</Behaviors>
</ig:WebHierarchicalDataGrid>*2.RowEditing 動作を EditingCore の動作コレクションに追加します。* EditingCore 動作はグリッドのような `Behaviors` コレクションがあります。RowEditing 動作は `EditingCore` タグの `Behaviors` タブに定義されます。
ASPX の場合:
<ig:EditingCore>
<Behaviors>
<ig:RowEditing></ig:RowEditing>
</Behaviors>
</ig:EditingCore>3.ページの ASPX ファイルを保存します。
コードおよびグリッドは以下のコード要素および機能があります。
ASPX の場合:
<ig:WebHierarchicalDataGrid ID="WebHierarchicalDataGrid1" runat="server">
<Behaviors>
<ig:EditingCore>
<Behaviors>
<ig:RowEditing></ig:RowEditing>
</Behaviors>
</ig:EditingCore>
</Behaviors>
</ig:WebHierarchicalDataGrid>1.EditingCore 動作を特定のバンドの動作コレクションに追加します。
ASPX で定義された各バンドは Behaviors コレクションがあります。その他の動作が定義された場合、EditingCore 動作は Behaviors タグで動作の兄弟として追加されます。
ASPX の場合:
<ig:Band AutoGenerateColumns=" DataMember="SqlDataSource2_DefaultView" Key="SqlDataSource2_DefaultView">
<Behaviors>
<ig:EditingCore>
</ig:EditingCore>
</Behaviors>
</ig:Band>*2.RowEditing 動作を EditingCore の動作コレクションに追加します。* EditingCore 動作はグリッドのような `Behaviors` コレクションがあります。RowEditing 動作は `EditingCore` タグの `Behaviors` タブに定義されます。
ASPX の場合:
<ig:EditingCore>
<Behaviors>
<ig:RowEditing></ig:RowEditing>
</Behaviors>
</ig:EditingCore>3.ページの ASPX ファイルを保存します。
コードおよびグリッドは以下のコード要素および機能があります。
ASPX の場合:
<ig:Band AutoGenerateColumns=" DataMember="SqlDataSource2_DefaultView" Key="SqlDataSource2_DefaultView" >
<Behaviors>
<ig:EditingCore>
<Behaviors>
<ig:RowEditing></ig:RowEditing>
</Behaviors>
</ig:EditingCore>
</Behaviors>
</ig:Band>EditingCore および RowEditing 動作で EnableInheritance を true に設定します。
グリッドの動作コレクションで、EditingCore および RowEditing 動作の EnableInheritance を true に設定します。
ASPX の場合:
<ig:WebHierarchicalDataGrid ID="WebHierarchicalDataGrid1" runat="server">
<Behaviors>
<ig:EditingCore EnableInheritance="true">
<Behaviors>
<ig:RowEditing EnableInheritance="true"></ig:RowEditing>
</Behaviors>
</ig:EditingCore>
</Behaviors>
</ig:WebHierarchicalDataGrid>結果を検証するために、MVC プロジェクトを実行します。結果を検証するために、 プロジェクトを実行します。指定したバンドの行編集動作を有効にしました。
この手順は、ランタイムにコード ビハインドで WebHierarchicalDataGrid に RowEditing 動作を追加します。この方法は、条件付きで動作を追加する場合に便利です。RowEditing 動作は EditingCore 動作の Behaviors コレクションに追加されます。つまり、ランタイムに EditingCore 動作も追加します。
各バンドおよび親 WebHierarchicalDataGrid の動作を変更するには、InitializeBand イベントを使用してください。初期化されているバンドを決定するには、バンドの一意識別子として操作する DataMember プロパティを使用します。このイベントでバンドを変更する場合、変更を適用するために WebHierarchicalDataGrid の RefreshBehaviors メソッドを呼び出してください。動作の定義はデフォルトで ViewState に保存されるので、初期読み込みのみで変更を実行します。ポストバックで動作を変更しない場合、ポストバックに実行する必要がありません。
以下のスクリーンショットは最終結果のプレビューです。
この手順を実行するには、以下が必要です。
ASP.NET Visual Studio web サイトまたは web アプリケーション
階層データ ソースにバインドされた WebHierarchicalDataGrid 。
プロジェクトに含まれ、 web.config ファイルで構成された ig_res フォルダーおよびスタイルセット
Infragistics.Web.UI.GridControls 名前空間の using ステートメント
以下はプロセスの概要です。
1.InitializeBand イベントのイベント ハンドラーの作成
2.InitializeBand イベントでコード ビハインドに行編集の有効化
3. (オプション) コード ビハインドにすべてのバンドで行編集の有効化
4. (オプション) * 結果の検証*
以下の手順では、コード ビハインドで行編集の動作を有効にする方法を示します。
InitializeBand イベントでイベントおよびイベント ハンドラーを作成します。
C# の場合:
using Infragistics.Web.UI.GridControls;
protected void Page_Init(object sender, EventArgs e)
{
this.WebHierarchicalDataGrid1.InitializeBand += new InitializeBandEventHandler(WebHierarchicalDataGrid1_InitializeBand);
}
void WebHierarchicalDataGrid1_InitializeBand(object sender, BandEventArgs e)
{
}*1.指定したバンドに EditingCore および RowEditing 動作を追加します。* InitializeBand イベントは各バンドで発生するため、バンドの DataMember プロパティを取得し、そのバンドに変更を適用します。この例では、 _SqlDataSource1_DefaultView_ バンドに EditingCore および RowEditing 動作を追加します。
C# の場合:
void WebHierarchicalDataGrid1_InitializeBand(object sender, BandEventArgs e)
{
WebHierarchicalDataGrid grid = sender as WebHierarchicalDataGrid;
if (grid != null)
{
if (!this.IsPostBack && e.Band.DataMember == "SqlDataSource1_DefaultView")
{
e.Band.Behaviors.CreateBehavior<EditingCore>();
e.Band.Behaviors.EditingCore.Behaviors.CreateBehavior<RowEditing>();
}
}
}3.バンドを変更した後に RefreshBehaviors を呼び出します。
C# の場合:
grid.RefreshBehaviors();4.コード ビハインド ファイルを保存します。
コードおよびグリッドは以下のコード要素および機能があります。
C# の場合:
void WebHierarchicalDataGrid1_InitializeBand(object sender, BandEventArgs e)
{
WebHierarchicalDataGrid grid = sender as WebHierarchicalDataGrid;
if (grid != null)
{
if (!this.IsPostBack && e.Band.DataMember == "SqlDataSource1_DefaultView")
{
e.Band.Behaviors.CreateBehavior<EditingCore>();
e.Band.Behaviors.EditingCore.Behaviors.CreateBehavior<RowEditing>();
}
grid.RefreshBehaviors();
}
}EditingCore および RowEditing 動作で EnableInheritance を true に設定します。
InitializeBand イベント ハンドラーで、EditingCore および RowEditing 動作の EnableInheritance を true に設定します。
C# の場合:
void WebHierarchicalDataGrid1_InitializeBand(object sender, BandEventArgs e)
{
WebHierarchicalDataGrid grid = sender as WebHierarchicalDataGrid;
if (grid != null)
{
if (!this.IsPostBack && e.Band.DataMember == "SqlDataSource1_DefaultView")
{
e.Band.Behaviors.CreateBehavior<EditingCore>();
e.Band.Behaviors.EditingCore.Behaviors.CreateBehavior<RowEditing>();
e.Band.Behaviors.EditingCore.EnableInheritance = true;
e.Band.Behaviors.EditingCore.Behaviors.RowEditing.EnableInheritance = true;
}
grid.RefreshBehaviors();
}
}結果を検証するために、MVC プロジェクトを実行します。結果を検証するために、 プロジェクトを実行します。行編集が有効なバンドを選択し、行をダブルクリックします。行は編集モードに入ります。
このトピックの追加情報については、以下のトピックも合わせてご参照ください。
このトピックについては、以下のサンプルも参照してください。