« 分割レイアウト | トップページ | ツールチップ »

2007年7月30日 (月)

ヘルプ付きのテキストボックス

div要素にdojoType="dropdowncontainer"を指定すると、ヘルプ付きのテキストボックスが作成される。 テキストボックスの右側にはアイコンが配置され、アイコンを押すと指定したヘルプ内容のHTML要素が表示される。 利用するときは、DropdownContainerをrequireする。

<script type="text/javascript">
  dojo.require("dojo.widget.DropdownContainer");
</script>

DropdownContainerのdiv要素は以下の属性を指定できる。その子要素にヘルプとして表示する内容を指定する。

属性概要
inputWidth テキストボックスのサイズ
inputId テキストボックスのId
inputName テキストボックスのname
iconURL アイコンのURL
iconAlt アイコンのalt属性
containerToggleDuration アイコンを押してからヘルプが表示されるまでの時間

 
<style type="text/css">
.popup {
  border: 3px solid blue;
  background-color: white;
  text-align:left;
}
</style>
<div dojoType="dropdowncontainer" id="foo">
  <div class="popup">
    入力フォームに名前を入力して下さい。<br/>
    必須入力です。
  </div>
</div>

« 分割レイアウト | トップページ | ツールチップ »

コメント

コメントを書く

(ウェブ上には掲載しません)

トラックバック

この記事のトラックバックURL:
http://app.f.cocolog-nifty.com/t/trackback/232684/7333587

この記事へのトラックバック一覧です: ヘルプ付きのテキストボックス:

« 分割レイアウト | トップページ | ツールチップ »