Repeater で ConfirmButton を使用する (VB)

作成者: Christian Wenz

PDF のダウンロード

AJAX Control Toolkit の ConfirmButton エクステンダーは、ユーザーがボタン (LinkButton コントロールを含む) をクリックすると、Yes/No ポップアップを作成します。 [はい] をクリックした場合にのみ、ボタンのアクションが実行され、それ以外の場合は取り消されます。 これは、リピータでも可能です。

概要

AJAX Control Toolkit の ConfirmButton エクステンダーは、ユーザーがボタン (LinkButton コントロールを含む) をクリックすると、Yes/No ポップアップを作成します。 [はい] をクリックした場合にのみ、ボタンのアクションが実行され、それ以外の場合は取り消されます。 これは、リピータでも可能です。

手順

まず、データ ソースが必要です。 このサンプルでは、AdventureWorks データベースと Microsoft SQL Server 2005 Express Editionを使用します。 データベースは、Visual Studio のインストール (Express Edition を含む) のオプションの部分であり、 の下 https://go.microsoft.com/fwlink/?LinkId=64064の別のダウンロードとしても利用できます。 AdventureWorks データベースは、SQL Server 2005 サンプル データベースとサンプル データベースの一部です (ダウンロード時https://www.microsoft.com/download/details.aspx?id=10679)。 データベースをセットアップする最も簡単な方法は、Microsoft SQL Server Management Studio (/sql/ssms/download-sql-server-management-studio-ssms) を使用してデータベース ファイルをAdventureWorks.mdfアタッチすることです。

このサンプルでは、SQL Server 2005 Express Editionのインスタンスが呼び出SQLEXPRESSされ、Web サーバーと同じコンピューター上に存在することを前提としています。これは既定のセットアップでもあります。 セットアップが異なる場合は、データベースの接続情報を調整する必要があります。

ASP.NET AJAX と Control Toolkit の機能をアクティブにするには、コントロールを ScriptManager ページ上の任意の場所 (ただし、 要素内) に配置する <form> 必要があります。

<asp:ScriptManager ID="asm" runat="server" />

次に、データ ソースが必要です。 わかりやすくするために、AdventureWorks の Vendors テーブルの最初の 5 つのエントリのみが取得されます。 Visual Studio ウィザードを使用してデータ ソースを作成する場合、現在、テーブル名 (Vendors) には 正しいプレフィックスが付 Purchasingいていません。 次のマークアップが正しいマークアップです。

<asp:SqlDataSource ID="sds1" runat="server" ConnectionString="
 Data Source=(local)\SQLEXPRESS;Initial Catalog=AdventureWorks;Integrated Security=True"
 ProviderName="System.Data.SqlClient" SelectCommand="SELECT TOP 5
 [VendorID], [Name] FROM [Purchasing].[Vendor]" />

このデータ ソースは、リピータ内で使用できます。 通常どおり、 メソッドは DataBinder.Eval() データ ソースからデータを取得します。 ConfirmButtonExtenderその後、データ ソース内のすべてのエントリに対して表示されるように、コントロールをリピータのセクション内<ItemTemplate>に配置する必要があります。

<div>
 <ul>
 <asp:Repeater ID="rep1" DataSourceID="sds1" runat="server">
 <ItemTemplate>
 <li>
 <%#DataBinder.Eval(Container.DataItem, "Name")%>
 <asp:LinkButton ID="btn1" Text="Remove Item" runat="server" />
 <ajaxToolkit:ConfirmButtonExtender ID="cfe1" runat="server" TargetControlID="btn1" ConfirmText="Are you sure?!" />
 </li>
 </ItemTemplate>
 </asp:Repeater>
 </ul>
</div>

データ ソースの各エントリの横に確認ボタンが表示されます

データ ソースの各エントリの横に [確認] ボタンが表示されます (フルサイズの画像を表示するには、ここをクリックします)