検索
連載

HTMLやStrutsに必須の“タグ”と“サブミット”の常識Webアプリの常識をJSPとStrutsで身につける(4)(3/3 ページ)

本連載は、JSP/サーブレット+StrutsのWebアプリケーション開発を通じて、Java言語以外(PHPやASP.NET、Ruby on Railsなど)の開発にも通用するWebアプリケーション全般の広い知識・常識を身に付けるための連載です

PC用表示 関連情報
Share
Tweet
LINE
Hatena
前のページへ |       

サンプルを動かすと……

 では、早速動かしてみましょう。連載第2回と同様に、Eclipseを起動します。次に、[プロジェクト・エクスプローラー]の「Hello」を選択して右クリックをして、[リフレッシュ]を選択します。Eclipseで[プロジェクト]の[クリーン]を選択して、Helloプロジェクトのコンパイルが完了したら、Eclipse上から「Tomcat起動」アイコン(猫マーク)を押して、Tomcatを起動してください。

 正常に起動したことを確認したら、下記のURLにアクセスしてください。

*** 一部省略されたコンテンツがあります。PC版でご覧ください。 ***

 すると、図2のような画面が表示されます。

図2 Strutsのhtmlタグを使ったサンプル
図2 Strutsのhtmlタグを使ったサンプル

Strutsの主なhtmlタグライブラリの使い方

 では、今回のサンプルプログラムのStruts.jspで使ったタグライブラリについて、簡単に説明します。

テキストボックス<html:text>

図3 &lt;html:text&gt;タグの例
図3 <html:text>タグの例

 テキストボックスは<html:text>タグで生成します。標準のHTMLタグでいう「<input type="text">」と同様の役割です。なお、属性に「size」を付けることで、入力エリアのサイズを文字数で指定することも可能です。今回は名前の入力フォームとしても使用しています。

*** 一部省略されたコンテンツがあります。PC版でご覧ください。 ***

パスワード<html:password>

図4 &lt;html:password&gt;タグの例
図4 <html:password>タグの例

 パスワードのフィールドは<html:password>タグで生成します。標準のHTMLタグでいう「<input type="password">」と同様の役割です。今回使用している属性「redisplay」はfalseに設定することで、入力された内容を非表示にすることが可能です。

*** 一部省略されたコンテンツがあります。PC版でご覧ください。 ***

テキストエリア<html:textarea>

図5 &lt;html:textarea&gt;タグの例
図5 <html:textarea>タグの例

 テキストボックスは<html:textarea>で生成します。標準のHTMLタグでいう「<textarea>」と同様の役割です。属性で「rows」や「cols」を用いることにより、行数や列数の指定ができます。

*** 一部省略されたコンテンツがあります。PC版でご覧ください。 ***

チェックボックス<html:checkbox>

図6 &lt;html:checkbox&gt;タグの例
図6 <html:checkbox>タグの例

 テキストボックスは<html:checkbox>で生成します。今回は、チェックボックスを1つだけ使用する場合でしたが、複数のチェックボックスを使用する場合には<html:multibox>を使用します。

*** 一部省略されたコンテンツがあります。PC版でご覧ください。 ***

ラジオボタン<html:radio>

図7 &lt;html:radio&gt;タグの例
図7 <html:radio>タグの例

 ラジオボタンは<html:radio>で生成します。ラジオボタンは、同じ「property」同士で複数連携可能です。

*** 一部省略されたコンテンツがあります。PC版でご覧ください。 ***

ドロップダウン<html:select>と<html:option>

図8 &lt;html:select&gt;と&lt;html:option&gt;タグの例
図8 <html:select>と<html:option>タグの例

 ラジオボタンは<html:select>で生成します。<html:option>と組み合わせて、ドロップダウンの選択数を増やすことができます。また、<html:select>の属性「value」で指定した値と一致する<html:option>の「value」の値をデフォルトとして表示することが可能です。

*** 一部省略されたコンテンツがあります。PC版でご覧ください。 ***

リンク<html:link>

図9 &lt;html:link&gt;タグの例
図9 <html:link>タグの例

 ハイパーリンクは<html:link>で生成します。標準のHTMLのリンクタグ<a>と使用方法はほとんど変わりません。

*** 一部省略されたコンテンツがあります。PC版でご覧ください。 ***

イメージ<html:img>

図10 &lt;html:img&gt;タグの例
図10 <html:img>タグの例

 イメージは<html:img>で生成します。画像を表示するために使用します。

*** 一部省略されたコンテンツがあります。PC版でご覧ください。 ***

ボタン<html:button>

図11 &lt;html:button&gt;タグの例
図11 <html:button>タグの例

 ボタンは<html:button>で生成します。「onclick」属性を指定することで、イベントで実行するJavaScriptの関数を指定できます。

*** 一部省略されたコンテンツがあります。PC版でご覧ください。 ***

イメージボタン<html:image>

図12 &lt;html:image&gt;タグの例
図12 <html:image>タグの例

 イメージボタンは<html:image>で生成します。画像付きのボタンで、サブミットを行いたい場合に使用します。

*** 一部省略されたコンテンツがあります。PC版でご覧ください。 ***

サブミットボタン<html:submit>

図13 &lt;html:submit&gt;タグの例
図13 <html:submit>タグの例

 サブミットボタンは<html:submit>で生成します。属性「value」で指定した値がボタン名となります。

*** 一部省略されたコンテンツがあります。PC版でご覧ください。 ***

標準のHTMLタグやJSPを使用するよりシンプルに

 このように、Strutsタグの使用方法は、形式の指定の違いだけでさほどHTMLの定義と変わりません。Strutsタグを使用することによって、標準のHTMLタグやJSPを使用するよりシンプルで、誰にでも分かりやすいプログラムを作成できます。

 tilesタグやbeanタグ、logicタグ、nestedタグについては今後の連載で詳細を説明していく予定です。

プロフィール

シャム カダカ
株式会社メセナ・ネットコム所属

旅行業務でStrutsを使ったWebアプリケーション開発に携わる。現在、Xoopsを使った社内ポータル構築を担当中。真のプログラマとして、新しい技術に目を向けて未来に役立てるよう努めている。

趣味はウォーキング、サッカー、バレーボール。



前のページへ |       

Copyright © ITmedia, Inc. All Rights Reserved.

ページトップに戻る