DataGridで動的にボタンを表示するサンプル

ASP.NET

先日、.NET1.1で開発する際に、少し手間取ったので備忘録。

シナリオとしては、DataGridの中にボタンを置きたいが、
そのボタンはDataGridに表示する内容により、
表示するパターンと表示しないパターンが有るという場合。

サンプルコード

.aspx側

<asp:datagrid id=dt_AppList runat="server" AllowSorting="True" OnItemDataBound="dt_AppList_ItemBound">
 <Columns>
  <asp:BoundColumn DataField="品物" SortExpression="品物番号" HeaderText="品物"> </asp:BoundColumn>
  <asp:BoundColumn DataField="確認結果" SortExpression="品物番号" HeaderText="確認結果"></asp:BoundColumn>
  <asp:ButtonColumn Text="在庫確認" ButtonType="PushButton" CommandName="Select"></asp:ButtonColumn>
 </Columns>
</asp:datagrid>

.vb側

'ItemDataBoundイベントを拾うメソッド
Public Sub dt_AppList_ItemBound(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.DataGridItemEventArgs) Handles dt_AppList.ItemDataBound

 'ヘッダーフッターの回避
 If e.Item.ItemIndex >= 0 Then
  '空のデータには「&nbsp;」が入っている
  If e.Item.Cells(1).Text <> "&nbsp;" Then
   '確認ボタンを非表示にし、確認済みの文言を表示
   e.Item.Cells(2).Controls(0).Visible = False
   e.Item.Cells(2).Text = "確認済み"
  End If
 End If

End Sub

処理の概要

初めにDataGridのボタン列として、ボタンを定義しておき、
表示するデータをバインドした時のタイミング（ItemBoundイベント）で、
条件判断を行なって表示制御をかけています。


コツは、ItemBoundイベントと、ItemIndexプロパティにあります。
簡単に説明すると、ItemBoundイベントは、
DataGridにデータがバインドされるたびに発火するイベントで、
ItemIndexプロパティは、ItemBoundイベントが発火した際に、
どのセルでイベントが起こっているかを示すプロパティです。


サンプルコードでは、ItemBoundイベントが発火した際に、
ItemIndexを参照し、インデックスが１つ目のセルが空白意外の場合は、
確認済みボタンを非表示にしています。

まとめ

動的にDataGridにボタンを配置したいときは、
初めにボタン列として定義する。

ItemBoundイベントを拾い、
ItemIndexプロパティを参照して、バインドされたデータで制御をかける。