ASP.NET と Visual Basic .NET を使用して DataGrid 列の CheckBox コントロール値をループして調べる

この記事では、ASP.NET DataGrid コントロールの各行をループ処理する方法と、行の識別に使用 ASP.NET CheckBox サーバーコントロールが選択されているかどうかを確認する方法について説明します。

元の製品バージョン: Visual Basic
元の KB 番号: 321881

概要

この記事のサンプルコードでは、Microsoft SQL Server Northwind データベースを使用して DataGrid コントロールを設定し、各行の最初の列に CheckBox サーバーコントロールを追加します。これは、ユーザーが DataGrid 内の複数の特定の行を選択できるようにする一般的な手法です。

この記事では、次の .NET Framework クラスライブラリ名前空間について説明します。

System.Data.SqlClient
System.Text

Requirements

ウィンドウズ
.NET Framework
インターネットインフォメーションサービス (IIS)
Visual Studio .NET

Visual Basic .NET を使用して ASP.NET Web アプリケーションを作成する

Visual Studio .NET を起動します。
[ファイル] メニューの [新規作成]をポイントし、 [プロジェクト]をクリックします。
[新しいプロジェクト] ダイアログボックスで、[プロジェクトの種類] で [Visual Basic プロジェクト] を選択し、[テンプレート] の下 ASP.NET Web アプリケーションを選択します。
[ 場所 ] ボックスで、 WebApplication# の既定の名前を MyWebApp に置き換えます。ローカルサーバーを使用している場合は、サーバー名を http://localhostのままにすることができます。結果の [場所 ] ボックスが http://localhost/MyWebAppとして表示されます。

サンプル Web フォームページを作成する

次のように、ASP.NET Web アプリケーションに新しい Web フォームを追加します。
1. ソリューションエクスプローラーでプロジェクトノードを右クリックし、[ 追加] をポイントし、[ Web フォームの追加] をクリックします。
2. [ 名前 ] ボックスに 「MySample.aspx」と入力し、[ 開く] を選択します。
[ プロパティ ] ウィンドウで、ドキュメントの pageLayout プロパティを FlowLayout に変更します。サンプルコードを使用するためにこれを行う必要はありませんが、これにより、プレゼンテーションがよりクリーンに表示されます。
次のように、DataGrid、Button、および Label サーバーコントロールをページに追加します。
1. ASP.NET DataGrid サーバーコントロールを Web フォームツールボックスからページにドラッグします。
2. [ プロパティ ] ウィンドウで、DataGrid コントロールの ID をDemoGrid に変更します。
3. ASP.NET Button サーバーコントロールを Web フォームツールボックスから DataGrid の下のページにドラッグします。
4. [ プロパティ ] ウィンドウで、Button コントロールの ID をGetSelections に変更し、[ テキスト ] プロパティを [選択範囲の取得] に変更します。
5. ASP.NET Label サーバーコントロールを Web フォームツールボックスから Button コントロールの下のページにドラッグします。
6. [プロパティ] ウィンドウで、Label コントロールの ID をResultsInfo に変更し、Text プロパティ内の任意のテキストを削除します。

エディターで HTML ビューに切り替えます。既定の DataGrid テンプレートにコードを追加して、列を構築します。コントロールの結果のコードは次のようになります。

<asp:DataGrid id="DemoGrid" runat="server" DataKeyField="CustomerID">
    <Columns>
        <asp:TemplateColumn HeaderText="Customer">
            <ItemTemplate>
                <asp:CheckBox ID="myCheckbox" Runat="server" />
            </ItemTemplate>
        </asp:TemplateColumn>
    </Columns>
</asp:DataGrid>

ページを右クリックし、[ コードの表示] をクリックします。これにより、コードビハインドクラスファイルがエディターで開きます。分離コードクラスファイルに次の名前空間参照を追加します。
```
Imports System.Data.SqlClient
Imports System.Text
```

Page_Load イベントハンドラーの既存のコードを次のコードに置き換えます。

Private Sub Page_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load
   If Not IsPostBack Then
      'Create a SqlConnection object.
      'Modify the connection string as necessary for your environment.
      Dim cn As SqlConnection = New SqlConnection("Server=localhost;database=Northwind;UID=sa;PWD=")
      Dim cmd As SqlCommand = New SqlCommand("SELECT * FROM Customers", cn)
      cn.Open()
      Dim reader As SqlDataReader = cmd.ExecuteReader()
      DemoGrid.DataSource = reader
      DataBind()
      reader.Close()
      cn.Close()
   End If
End Sub

デザインビューに切り替え、[ GetSelections] をダブルクリックします。これにより、コードビハインドクラスファイルがエディターで開きます。 GetSelections_Click イベントハンドラー内の既存のコードを次のコードに置き換えます。

Private Sub GetSelections_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles GetSelections.Click
    Dim rowCount As Integer = 0
    Dim gridSelections As StringBuilder = New StringBuilder()'Loop through each DataGridItem, and determine which CheckBox controls
    'have been selected.
    Dim DemoGridItem As DataGridItem
    For Each DemoGridItem In DemoGrid.Items

        Dim myCheckbox As CheckBox = CType(DemoGridItem.Cells(0).Controls(1), CheckBox)
        If myCheckbox.Checked = True Then
            rowCount += 1
            gridSelections.AppendFormat("The checkbox for {0} was selected<br>", _
            DemoGrid.DataKeys(DemoGridItem.ItemIndex).ToString())
        End If
    Next
    gridSelections.Append("<hr>")
    gridSelections.AppendFormat("Total number selected is: {0}<br>", rowCount.ToString())
    ResultsInfo.Text = gridSelections.ToString()
End Sub

動作することを確認する

[ ファイル ] メニューの [ すべて保存 ] をクリックして、Web フォームとプロジェクトに関連付けられている他のファイルを保存します。
Visual Studio .NET 統合開発環境 (IDE) の [ ビルド ] メニューで、[ソリューションの ビルド] をクリックします。
ソリューションエクスプローラーで、Web フォームページ (MySample.aspx) を右クリックし、[ ブラウザーで表示] をクリックします。ページにグリッド内のデータが表示されていることに注意してください。さらに、各行の最初の列にチェックボックスが表示されます。ユーザーはこのチェックボックスをオンにして、特定の行をマークできます。
クリックして行のチェックボックスをいくつか選択し、[選択項目の取得] をクリックします。

ページがサーバーへのラウンドトリップを行い、 GetSelections_Click イベントハンドラーでコードを実行すると、前の手順で選択した項目の一覧が表示されます。 GetSelections_Click イベントハンドラーのコードは、ASP.NET DataGrid サーバーコントロール内の各DataGridItemをループ処理し、関連する CheckBox コントロールの Checked プロパティが true かどうかを判断し、関連付けられたキー値を DataGrid のDataKeysの特定の位置に記録します。

References

Last updated on 2020-04-22