データ変更インターフェイスをカスタマイズする (C#)

  • [アーティクル]

作成者: Scott Mitchell

PDF のダウンロード

このチュートリアルでは、標準の TextBox コントロールと CheckBox コントロールを代替入力 Web コントロールに置き換えて、編集可能な GridView のインターフェイスをカスタマイズする方法について説明します。

はじめに

GridView コントロールと DetailsView コントロールで使用される BoundFields および CheckBoxFields は、読み取り専用、編集可能、および挿入可能なインターフェイスをレンダリングする機能により、データを変更するプロセスを簡略化します。 これらのインターフェイスは、宣言型マークアップやコードを追加しなくてもレンダリングできます。 ただし、BoundField と CheckBoxField のインターフェイスには、多くの場合、実際のシナリオで必要なカスタマイズ性がありません。 GridView または DetailsView で編集可能または挿入可能なインターフェイスをカスタマイズするには、代わりに TemplateField を使用する必要があります。

前の チュートリアル では、検証 Web コントロールを追加してデータ変更インターフェイスをカスタマイズする方法について説明しました。 このチュートリアルでは、BoundField コントロールと CheckBoxField コントロールの標準 TextBox コントロールと CheckBox コントロールを代替入力 Web コントロールに置き換えて、実際のデータ コレクション Web コントロールをカスタマイズする方法について説明します。 特に、製品名、カテゴリ、サプライヤー、および廃止された状態を更新できるようにする編集可能な GridView を構築します。 特定の行を編集すると、カテゴリフィールドとサプライヤーフィールドは DropDownLists としてレンダリングされ、選択可能なカテゴリとサプライヤーのセットが含まれます。 さらに、CheckBoxField の既定の CheckBox を、"Active" と "Discontinued" の 2 つのオプションを提供する RadioButtonList コントロールに置き換えます。

GridView の編集インターフェイスには、DropDownLists と RadioButton が含まれています

図 1: GridView の編集インターフェイスには、DropDownLists と RadioButton が含まれています (フルサイズの画像を表示する をクリックします)

手順 1: 適切なUpdateProductオーバーロードを作成する

このチュートリアルでは、製品名、カテゴリ、サプライヤー、および廃止された状態の編集を許可する編集可能な GridView を構築します。 したがって、これら 4 つの積値に を加えた 5 つの入力パラメーターを受け取るオーバーロードがProductID必要UpdateProductです。 前のオーバーロードと同様に、次のようになります。

  1. 指定した ProductIDのデータベースから製品情報を取得します。
  2. 、ProductNameCategoryIDSupplierIDおよび の各フィールドをDiscontinued更新します。
  3. TableAdapter Update() の メソッドを使用して、更新要求を DAL に送信します。

簡潔にするために、この特定のオーバーロードのために、私は販売中止としてマークされている製品がそのサプライヤーによって提供される唯一の製品ではないことを保証するビジネスルールのチェックを省略しました。 必要に応じてそれを に追加するか、ロジックを別のメソッドにリファクタリングするのが理想的です。

次のコードは、 クラスの新しい UpdateProduct オーバーロードを ProductsBLL 示しています。

[System.ComponentModel.DataObjectMethodAttribute(System.ComponentModel.DataObjectMethodType.Update, false)]
public bool UpdateProduct(string productName, int? categoryID,
    int? supplierID, bool discontinued, int productID)
{
    Northwind.ProductsDataTable products = Adapter.GetProductByProductID(productID);
    if (products.Count == 0)
        // no matching record found, return false
        return false;
    Northwind.ProductsRow product = products[0];
    product.ProductName = productName;
    if (supplierID == null) product.SetSupplierIDNull();
      else product.SupplierID = supplierID.Value;
    if (categoryID == null) product.SetCategoryIDNull();
      else product.CategoryID = categoryID.Value;
    product.Discontinued = discontinued;
    // Update the product record
    int rowsAffected = Adapter.Update(product);
    // Return true if precisely one row was updated, otherwise false
    return rowsAffected == 1;
}

手順 2: 編集可能な GridView を作成する

オーバーロードが UpdateProduct 追加されたので、編集可能な GridView を作成する準備ができました。 フォルダー内のCustomizedUI.aspxページをEditInsertDelete開き、GridView コントロールをDesignerに追加します。 次に、GridView のスマート タグから新しい ObjectDataSource を作成します。 クラスGetProducts()の メソッドを使用して製品情報を取得し、先ほど作成したオーバーロードをProductBLL使用してUpdateProduct製品データを更新するように ObjectDataSource を構成します。 [挿入] タブと [削除] タブで、ドロップダウン リストから [(なし)] を選択します。

作成したばかりの UpdateProduct オーバーロードを使用するように ObjectDataSource を構成する

図 2: 作成したオーバーロードを使用 UpdateProduct するように ObjectDataSource を構成する (クリックするとフルサイズの画像が表示されます)

データ変更のチュートリアルで説明したように、Visual Studio によって作成された ObjectDataSource の宣言構文によって、 プロパティが OldValuesParameterFormatString に original_{0}割り当てられます。 もちろん、このメソッドでは元 ProductID の値が渡されるとは思わないので、これはビジネス ロジック レイヤーでは機能しません。 したがって、前のチュートリアルで行ったとおり、このプロパティの割り当てを宣言構文から削除するか、代わりにこのプロパティの値を に {0}設定します。

この変更後、ObjectDataSource の宣言型マークアップは次のようになります。

<asp:ObjectDataSource ID="ObjectDataSource1" runat="server"
    SelectMethod="GetProducts" TypeName="ProductsBLL"
    UpdateMethod="UpdateProduct">
    <UpdateParameters>
        <asp:Parameter Name="productName" Type="String" />
        <asp:Parameter Name="categoryID" Type="Int32" />
        <asp:Parameter Name="supplierID" Type="Int32" />
        <asp:Parameter Name="discontinued" Type="Boolean" />
        <asp:Parameter Name="productID" Type="Int32" />
    </UpdateParameters>
</asp:ObjectDataSource>

プロパティがOldValuesParameterFormatString削除され、オーバーロードでUpdateParameters予期される各入力パラメーターの コレクションに が存在Parameterする点に注意してくださいUpdateProduct。

ObjectDataSource は製品値のサブセットのみを更新するように構成されていますが、現在、GridView にはすべての 製品フィールドが表示されます。 GridView を編集して、次の作業を行います。

  • には、、ProductNameSupplierNameCategoryNameBoundFields、CheckBoxField Discontinued のみが含まれます
  • CategoryName CheckBoxField の前 (の左側) に表示される Discontinued フィールドと SupplierName フィールド
  • CategoryName BoundFields SupplierName プロパティHeaderTextは、それぞれ "Category" と "Supplier" に設定されます。
  • 編集のサポートが有効になっている (GridView のスマート タグの [編集を有効にする] チェック ボックスをチェック)

これらの変更後、Designerは図 3 のようになります。GridView の宣言構文を次に示します。

GridView から不要なフィールドを削除する

図 3: GridView から不要なフィールドを削除する (フルサイズの画像を表示する をクリックします)

<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False"
    DataKeyNames="ProductID" DataSourceID="ObjectDataSource1">
    <Columns>
        <asp:BoundField DataField="ProductName"
           HeaderText="ProductName" SortExpression="ProductName" />
        <asp:BoundField DataField="CategoryName" HeaderText="Category"
           ReadOnly="True"
           SortExpression="CategoryName" />
        <asp:BoundField DataField="SupplierName" HeaderText="Supplier"
           ReadOnly="True"
           SortExpression="SupplierName" />
        <asp:CheckBoxField DataField="Discontinued"
           HeaderText="Discontinued" SortExpression="Discontinued" />
    </Columns>
</asp:GridView>

この時点で、GridView の読み取り専用動作は完了です。 データを表示すると、各製品が GridView の行としてレンダリングされ、製品名、カテゴリ、仕入先、および廃止された状態が表示されます。

GridView の Read-Only インターフェイスが完了しました

図 4: GridView の Read-Only インターフェイスが完了しました (フルサイズの画像を表示する をクリックします)

注意

「 データの挿入、更新、および削除の概要」チュートリアルで説明したように、GridView のビューステートを有効にすることが非常に重要です (既定の動作)。 GridView の EnableViewState プロパティを に false設定すると、同時実行ユーザーが意図せずにレコードを削除または編集するリスクが発生します。

手順 3: カテゴリおよびサプライヤー編集インターフェイスに DropDownList を使用する

オブジェクトにはProductsRow、CategoryNameデータベース テーブル内のCategoryID実際の外部キー ID 値と および SupplierName テーブル内の対応するName値をProducts提供する、、SupplierID、、および Suppliers プロパティが含まれていることをCategories思い出してください。 と はProductRowCategoryIDSupplierID両方とも読み取りと書き込みが可能ですが、 CategoryName プロパティと SupplierName プロパティは読み取り専用としてマークされます。

プロパティと SupplierName プロパティの読み取り専用のCategoryName状態により、対応する BoundFields のプロパティが ReadOnly にtrue設定されているため、行の編集時にこれらの値が変更されなくなります。 プロパティを ReadOnly にfalse設定できますが、編集中に CategoryName BoundFields と SupplierName BoundFields を TextBoxes としてレンダリングすると、入力と SupplierName 入力を受け取るCategoryNameオーバーロードがないためUpdateProduct、ユーザーが製品を更新しようとすると例外が発生します。 実際、次の 2 つの理由から、このようなオーバーロードを作成する必要はありません。

  • テーブルには Products または CategoryName フィールドはありませんがSupplierName、 SupplierID と CategoryIDがあります。 したがって、このメソッドには、参照テーブルの値ではなく、これらの特定の ID 値を渡す必要があります。
  • 仕入先またはカテゴリの名前を入力するようユーザーに要求することは、ユーザーが利用可能なカテゴリとサプライヤーと正しいスペルを知っている必要があるため、理想的ではありません。

[仕入先] フィールドと [カテゴリ] フィールドには、読み取り専用モードの場合はカテゴリと仕入先の名前が表示され (現在と同様)、編集時に適用可能なオプションのドロップダウン リストが表示されます。 ドロップダウン リストを使用すると、エンド ユーザーは、どのカテゴリやサプライヤーを選択できるかをすばやく確認でき、より簡単に選択できます。

この動作を提供するには、 と CategoryName BoundFields を TemplateFields ItemTemplate に変換SupplierNameする必要があります。このフィールドは、 と CategoryName の値をSupplierName出力しEditItemTemplate、 DropDownList コントロールを使用して使用可能なカテゴリとサプライヤーを一覧表示します。

CategoriesおよびSuppliersDropDownLists の追加

まず、 と CategoryName BoundFields を TemplateFields に変換SupplierNameします。GridView のスマート タグから [列の編集] リンクをクリックし、左下のリストから BoundField を選択し、[このフィールドを TemplateField に変換する] リンクをクリックします。 変換プロセスでは、次の宣言構文に示すように、 と の両方 ItemTemplate を EditItemTemplate含む TemplateField が作成されます。

<asp:TemplateField HeaderText="Category" SortExpression="CategoryName">
    <EditItemTemplate>
        <asp:Label ID="Label1" runat="server"
          Text='<%# Eval("CategoryName") %>'></asp:Label>
    </EditItemTemplate>
    <ItemTemplate>
        <asp:Label ID="Label1" runat="server"
          Text='<%# Bind("CategoryName") %>'></asp:Label>
    </ItemTemplate>
</asp:TemplateField>

BoundField は読み取り専用としてマークされているため、 と の両方ItemTemplateに、該当するデータ フィールドにプロパティがバインドされている Label Web コントロールTextが含まれています (CategoryName上記のEditItemTemplate構文)。 を変更 EditItemTemplateする必要があります。Label Web コントロールは DropDownList コントロールに置き換えます。

前のチュートリアルで説明したように、テンプレートは、Designerを使用して編集することも、宣言構文から直接編集することもできます。 Designerを使用して編集するには、GridView のスマート タグから [テンプレートの編集] リンクをクリックし、[カテゴリ] フィールドの EditItemTemplateを操作することを選択します。 Label Web コントロールを削除し、DropDownList コントロールに置き換え、DropDownList の ID プロパティを に Categories設定します。

TexBox を削除し、EditItemTemplate に DropDownList を追加する

図 5: TexBox を削除し、DropDownList を に EditItemTemplate 追加します (フルサイズの画像を表示するにはクリックします)

次に、DropDownList に使用可能なカテゴリを設定する必要があります。 DropDownList のスマート タグから [データ ソースの選択] リンクをクリックし、 という名前 CategoriesDataSourceの新しい ObjectDataSource を作成することを選択します。

CategoriesDataSource という名前の新しい ObjectDataSource コントロールを作成する

図 6: 名前付きの CategoriesDataSource 新しい ObjectDataSource コントロールを作成する (フルサイズの画像を表示する 場合はクリックします)

この ObjectDataSource がすべてのカテゴリを返すようにするには、それをクラスの GetCategories() メソッドにCategoriesBLLバインドします。

ObjectDataSource を CategoriesBLL の GetCategories() メソッドにバインドする

図 7: ObjectDataSource を の メソッドにCategoriesBLLバインドします (フルサイズのGetCategories()画像を表示する 場合は、ここをクリックします)

最後に、各 DropDownList にフィールドが表示され、値として使用されるフィールドが表示されるように CategoryName 、DropDownList ListItem の CategoryID 設定を構成します。

CategoryName フィールドを表示し、CategoryID を値として使用する

図 8: フィールドを CategoryName 表示し、 CategoryID 値として使用する (フルサイズの画像を表示するをクリックします)

これらの変更を行った後、TemplateField の CategoryName のEditItemTemplate宣言型マークアップには、DropDownList と ObjectDataSource の両方が含まれます。

<asp:TemplateField HeaderText="Category" SortExpression="CategoryName">
    <EditItemTemplate>
        <asp:DropDownList ID="Categories" runat="server"
          DataSourceID="CategoriesDataSource"
          DataTextField="CategoryName" DataValueField="CategoryID">
        </asp:DropDownList>
        <asp:ObjectDataSource ID="CategoriesDataSource" runat="server"
            OldValuesParameterFormatString="original_{0}"
            SelectMethod="GetCategories" TypeName="CategoriesBLL">
        </asp:ObjectDataSource>
    </EditItemTemplate>
    <ItemTemplate>
        <asp:Label ID="Label1" runat="server"
          Text='<%# Bind("CategoryName") %>'></asp:Label>
    </ItemTemplate>
</asp:TemplateField>

注意

の DropDownList では EditItemTemplate 、ビュー ステートが有効になっている必要があります。 間もなく、DropDownList の宣言構文と databinding コマンドに databinding 構文を追加します。またBind()、 はEval()ビューステートが有効になっているコントロールにのみ表示されます。

TemplateField の に という名前Suppliersの DropDownList を追加するには、次のEditItemTemplate手順をSupplierName繰り返します。 これには、DropDownList を に追加し、別の EditItemTemplate ObjectDataSource を作成する必要があります。 Suppliersただし、DropDownList の ObjectDataSource は、クラスのGetSuppliers()メソッドを呼び出すように構成するSuppliersBLL必要があります。 さらに、フィールドをSuppliers表示し、そのListItemフィールドのCompanyName値としてフィールドをSupplierID使用するように DropDownList を構成します。

2 つの EditItemTemplate s に DropDownLists を追加した後、ブラウザーでページを読み込み、Chef Anton の Cajun Seasoning 製品の [編集] ボタンをクリックします。 図 9 に示すように、製品のカテゴリ列と仕入先列は、選択可能なカテゴリとサプライヤーを含むドロップダウン リストとして表示されます。 ただし、シェフアントンのケイジャン調味料はニューオーリンズ・ケイジャン・ディライトが提供する調味料であるにもかかわらず、両方のドロップダウンリストの 最初 の項目はデフォルトで選択されていることに注意してください( カテゴリの飲料とサプライヤーとしてのエキゾチックリキッド)。

Drop-Down Lists の最初の項目が既定で選択されている

図 9: Drop-Down Lists の最初の項目は既定で選択されています (フルサイズの画像を表示する 場合はクリックします)

さらに、[更新] をクリックすると、製品とSupplierID値CategoryIDが にNULL設定されていることがわかります。 これらの望ましくない動作はどちらも、s の DropDownLists EditItemTemplate が基になる製品データのデータ フィールドにバインドされていないために発生します。

DropDownLists を データ フィールドとSupplierIDデータ フィールドにCategoryIDバインドする

編集した製品のカテゴリと仕入先のドロップダウン リストを適切な値に設定し、[更新] をクリックしたときにこれらの値を BLL のUpdateProductメソッドに返すには、双方向データバインドを使用して DropDownLists のSelectedValueプロパティを および SupplierID データ フィールドにバインドするCategoryID必要があります。 これを DropDownList で Categories 実現するには、宣言構文に直接を追加 SelectedValue='<%# Bind("CategoryID") %>' します。

または、DropDownList のデータ バインドを設定するには、Designerを使用してテンプレートを編集し、DropDownList のスマート タグから [DataBindings の編集] リンクをクリックします。 次に、 プロパティを SelectedValue 双方向データ バインドを使用してフィールドに CategoryID バインドする必要があることを示します (図 10 を参照)。 宣言型またはDesignerプロセスを繰り返して、データ フィールドを SupplierID DropDownList にSuppliersバインドします。

Two-Way Databinding を使用して CategoryID を DropDownList の SelectedValue プロパティにバインドする

図 10: Two-Way Databinding を使用して DropDownList の SelectedValue プロパティに をバインドCategoryIDする (フルサイズの画像を表示する をクリックします)

2 つの DropDownList のプロパティに SelectedValue バインドが適用されると、編集された製品のカテゴリ列と仕入先列は、既定で現在の製品の値になります。 [更新] をクリックすると、 CategoryID 選択したドロップダウン リスト 項目の と SupplierID の値が メソッドに UpdateProduct 渡されます。 図 11 は、databinding ステートメントが追加された後のチュートリアルを示しています。シェフアントンのケイジャン調味料の選択されたドロップダウンリスト項目が正しくコンディメントとニューオーリンズケイジャンディライトであることに注意してください。

編集された製品の現在のカテゴリと仕入先の値は、既定で選択されています

図 11: 編集された製品の現在のカテゴリと仕入先の値が既定で選択されている (フルサイズの画像を表示する をクリックします)

値の処理NULL

テーブルの 列と SupplierID 列には CategoryID を指定NULLできますが、 の DropDownLists EditItemTemplate には、値を表すNULLリスト アイテムは含まれません。Products これには、次の 2 つの結果があります。

  • ユーザーは、当社のインターフェイスを使用して製品のカテゴリまたはサプライヤーを非NULL 値から非値に NULL 変更することはできません
  • 製品に または SupplierIDがある場合はNULLCategoryID、[編集] ボタンをクリックすると例外が発生します。 これは、ステートメントの NULLBind() (または SupplierID) によってCategoryID返される値が DropDownList 内の値にマップされないためです (DropDownList プロパティがリスト アイテムのコレクションにない値に設定されている場合SelectedValue、DropDownList は例外をスローします)。

と SupplierID の値をサポートNULLCategoryIDするには、値を表す別のListItem値を各 DropDownList に追加するNULL必要があります。 「Master/Detail Filtering With a DropDownList 」チュートリアルでは、Databound DropDownList に追加ListItemを追加する方法について説明しました。このチュートリアルでは、DropDownList の AppendDataBoundItems プロパティを にtrue設定し、追加の を手動で追加する方法について説明しましたListItem。 ただし、その前のチュートリアルでは、 の を ListItemValue-1追加しました。 ただし、ASP.NET のデータバインド ロジックでは、空白の文字列が自動的に値に NULL 変換され、その逆も行われます。 したがって、このチュートリアルでは、 の を ListItem空の Value 文字列にします。

最初に、両方の DropDownLists プロパティ AppendDataBoundItems を に設定します true。 次に NULLListItem 、宣言型マークアップが次のように表示されるように、各 DropDownList に次 <asp:ListItem> の要素を追加して を追加します。

<asp:DropDownList ID="Categories" runat="server"
    DataSourceID="CategoriesDataSource" DataTextField="CategoryName"
    DataValueField="CategoryID" SelectedValue='<%# Bind("CategoryID") %>'
    AppendDataBoundItems="True">
    <asp:ListItem Value="">(None)</asp:ListItem>
</asp:DropDownList>

私はこの ListItemのテキスト値として"(None)"を使用することを選択しましたが、必要に応じて空白の文字列に変更することもできます。

注意

「Master/Detail Filtering With a DropDownList (DropDownList を使用したマスター/詳細フィルター処理)」チュートリアルで説明したように、ListItemプロパティ ウィンドウの DropDownList のItemsプロパティ (コレクション エディターが表示ListItemされます) をクリックすることで、Designerを使用して DropDownList に s を追加できます。 ただし、宣言構文を使用して、このチュートリアルの を必ず追加 NULLListItem してください。 Collection エディターをListItem使用する場合、生成された宣言構文では、空白の文字列が割り当てられると設定が完全に省略Valueされ、 のような宣言型マークアップが作成されます<asp:ListItem>(None)</asp:ListItem>。 これは無害に見えるかもしれませんが、不足している Value により、DropDownList はその場所でプロパティ値を Text 使用します。 つまり、これが NULLListItem 選択されている場合、値 "(None)" が に CategoryID割り当てられ、例外が発生します。 を明示的に設定Value=""NULLすると、 が選択されたときにListItemNULL値が にCategoryID割り当てられます。

Suppliers DropDownList に対してこれらの手順を繰り返します。

この追加ListItemの を使用すると、図 12 に示すように、編集インターフェイスで Product の CategoryID フィールドと SupplierID フィールドに値を割り当てNULLることができるようになりました。

製品のカテゴリまたは仕入先に NULL 値を割り当てるには、(なし) を選択します

図 12: 製品のカテゴリまたは仕入先の値を割り当てる NULL ([なし] ) を選択します (フルサイズの画像を表示する をクリックします)

手順 4: 廃止された状態に RadioButtons を使用する

現在、製品の Discontinued データ フィールドは CheckBoxField を使用して表され、読み取り専用行の無効なチェック ボックスと編集中の行の有効なチェック ボックスが表示されます。 このユーザー インターフェイスは多くの場合に適していますが、TemplateField を使用して必要に応じてカスタマイズできます。 このチュートリアルでは、CheckBoxField を、ユーザーが製品 Discontinued の値を指定できる 2 つのオプション "Active" と "Discontinued" を持つ RadioButtonList コントロールを使用する TemplateField に変更します。

まず、CheckBoxField を Discontinued TemplateField に変換します。これにより、 と EditItemTemplateを使用ItemTemplateして TemplateField が作成されます。 どちらのテンプレートにも、データ フィールドにDiscontinuedバインドされたプロパティを持つ Checked CheckBox が含まれています。2 つの唯一の違いはItemTemplate、's CheckBox の Enabled プロパティが にfalse設定されていることです。

と の両方ItemTemplateの CheckBox を RadioButtonList コントロールに置き換え、両方の RadioButtonLists プロパティIDを にDiscontinuedChoice設定EditItemTemplateします。 次に、RadioButtonLists に 2 つのラジオ ボタンが含まれている必要があることを示します。1 つは "Active" というラベルが付き、値が "False" で、もう 1 つは "Discontinued" というラベルが付き、値が "True" であることを示します。 これを実現するには、宣言構文を使用して要素を<asp:ListItem>直接に入力するか、Designerの Collection エディターを使用ListItemします。 図 13 は、2 つのラジオ ボタン オプションがListItem指定された後のコレクション エディターを示しています。

追加

図 13: RadioButtonList に "Active" オプションと "Discontinued" オプションを追加する (フルサイズの画像を表示する をクリックします)

の ItemTemplate RadioButtonList は編集できないため、そのEnabledプロパティを にfalseEnabled設定します。このプロパティtrueは、 の RadioButtonList の (既定値) のままにしますEditItemTemplate。 これにより、編集されていない行のラジオ ボタンは読み取り専用になりますが、ユーザーは編集された行の RadioButton 値を変更できます。

製品のデータ フィールドに基づいて適切なラジオ ボタンが選択されるように、RadioButtonList コントロール SelectedValue の Discontinued プロパティを割り当てる必要があります。 このチュートリアルで前述した DropDownLists と同様に、このデータバインド構文は、宣言型マークアップに直接追加することも、RadioButtonLists のスマート タグの [DataBindings の編集] リンクを使用して追加することもできます。

2 つの RadioButtonList を追加して構成した後、 Discontinued TemplateField の宣言型マークアップは次のようになります。

<asp:TemplateField HeaderText="Discontinued" SortExpression="Discontinued">
    <ItemTemplate>
        <asp:RadioButtonList ID="DiscontinuedChoice" runat="server"
          Enabled="False" SelectedValue='<%# Bind("Discontinued") %>'>
            <asp:ListItem Value="False">Active</asp:ListItem>
            <asp:ListItem Value="True">Discontinued</asp:ListItem>
        </asp:RadioButtonList>
    </ItemTemplate>
    <EditItemTemplate>
        <asp:RadioButtonList ID="DiscontinuedChoice" runat="server"
            SelectedValue='<%# Bind("Discontinued") %>'>
            <asp:ListItem Value="False">Active</asp:ListItem>
            <asp:ListItem Value="True">Discontinued</asp:ListItem>
        </asp:RadioButtonList>
    </EditItemTemplate>
</asp:TemplateField>

これらの変更により、 Discontinued 列はチェックボックスのリストからラジオ ボタン ペアのリストに変換されました (図 14 を参照)。 製品を編集するときに、適切なラジオ ボタンが選択され、他のラジオ ボタンを選択して [更新] をクリックすることで、製品の廃止状態を更新できます。

廃止された CheckBox はラジオ ボタン ペアに置き換えられました

図 14: 廃止された CheckBox はラジオ ボタンペアに置き換えられました (フルサイズの画像を表示する をクリックします)

注意

データベース内の Discontinued 列には値を Products 含 NULL めることはできませんので、インターフェイスでの情報のキャプチャについて心配する NULL 必要はありません。 ただし、列に値を含めることができるNULL場合は、Discontinuedカテゴリやサプライヤーの DropDownList と同様に、空の文字列 (Value="") に設定された 3 つ目のラジオ ボタンをリストValueに追加します。

まとめ

BoundField と CheckBoxField は読み取り専用、編集、および挿入インターフェイスを自動的にレンダリングしますが、カスタマイズする機能がありません。 ただし、多くの場合、(前のチュートリアルで説明したように) 検証コントロールを追加するか、データ コレクションのユーザー インターフェイスをカスタマイズして (このチュートリアルで見た) 編集または挿入インターフェイスをカスタマイズする必要があります。 TemplateField を使用したインターフェイスのカスタマイズは、次の手順で合計できます。

  1. TemplateField を追加するか、既存の BoundField または CheckBoxField を TemplateField に変換する
  2. 必要に応じてインターフェイスを拡張する
  3. 双方向データ バインドを使用して、適切なデータ フィールドを新しく追加された Web コントロールにバインドする

組み込みの ASP.NET Web コントロールを使用するだけでなく、カスタムのコンパイル済みサーバー コントロールとユーザー コントロールを使用して TemplateField のテンプレートをカスタマイズすることもできます。

プログラミングに満足!

著者について

7 冊の ASP/ASP.NET 書籍の著者であり、 4GuysFromRolla.com の創設者である Scott Mitchell は、1998 年から Microsoft Web テクノロジと協力しています。 Scott は、独立したコンサルタント、トレーナー、ライターとして働いています。 彼の最新の本は サムズは24時間で2.0 ASP.NET 自分自身を教えています。 にアクセスするか、ブログを使用して にアクセスmitchell@4GuysFromRolla.comできます。これは でhttp://ScottOnWriting.NET見つけることができます。

前へ次へ