コントロール利用(その1)

前回は CTP Beta と Control Toolkit をインストールしました。

今回は ConfirmButtonExtender と TextBoxWatermarkExtender を使います。

ConfirmButtonExtender は ボタンを押したときに javascript の alert を出すために使えます。

TextBoxWatermarkExtender は未入力時のテキストボックス背景色を通常とは異なる色にする場合に使えます。

元ネタはこちら

 

準備

ツールボックスを右クリックして add tab を選びます。

タブに適当に名前をつけて・・・

AjaxControlToolkit.dll をドラッグアンドドロップします。

コントロールがタブに載りました。

 

ConfirmButtonExtender

Label, Button, ConfirmButtonExtender を配置します。

ボタンをクリックしたら、ラベルに現在日時を表示することとします。

ConfirmButtonExtender のターゲットを指定します。

ボタンの ConfirmText にメッセージを入力します。

動かして Button をクリックすると、javascipt の alert が表示されます。OK を押すとポストが発生し、キャンセルを押すとポストしません。

 

TextBoxWatermarkExtender

テキストボックス二つ、TextBoxWatermarkExtender 一つを配置します。

TextboxWatermarkExtender のターゲットを指定します。

テキストボックスの WatermarkText と WartermarkCssClass を指定します。

<head>タグの間に CSS(?)を記述します。

テキストボックスに入力が無いときは背景色がオレンジ色です。

フォーカスを入れるとオレンジ色から通常色に変わります。

入力したのでフォーカスを失っても背景色は通常色のままです。

 

サーバーで動かす

無事に動きました!