Struts 2-フォームタグ

*form* タグのリストは、Struts UIタグのサブセットです。 これらのタグは、Struts Webアプリケーションに必要なユーザーインターフェイスのレンダリングに役立ち、3つのカテゴリに分類できます。 この章では、3種類のUIタグすべてについて説明します。

シンプルなUIタグ

これらのタグはすでに例で使用していますが、この章ではそれらをブラッシングします。いくつかのシンプルなUIタグを持つシンプルなビューページ email.jsp を見てみましょう-

<%@ page language = "java" contentType = "text/html; charset = ISO-8859-1"
   pageEncoding = "ISO-8859-1"%>
<%@ taglib prefix = "s" uri = "/struts-tags"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   "http://www.w3.org/TR/html4/loose.dtd">

<html>
   <head>
      <s:head/>
      <title>Hello World</title>
   </head>

   <body>
      <s:div>Email Form</s:div>
      <s:text name = "Please fill in the form below:"/>

      <s:form action = "hello" method = "post" enctype = "multipart/form-data">
         <s:hidden name = "secret" value = "abracadabra"/>
         <s:textfield key = "email.from" name = "from"/>
         <s:password key = "email.password" name = "password"/>
         <s:textfield key = "email.to" name = "to"/>
         <s:textfield key = "email.subject" name = "subject"/>
         <s:textarea key = "email.body" name = "email.body"/>
         <s:label for = "attachment" value = "Attachment"/>
         <s:file name = "attachment" accept = "text/html,text/plain"/>
         <s:token/>
         <s:submit key = "submit"/>
      </s:form>

   </body>
</html>

HTMLを認識している場合、使用されるタグはすべて、非常に一般的なHTMLタグであり、追加のプレフィックス* s：*が各タグと異なる属性とともに追加されています。上記のプログラムを実行すると、使用するすべてのキーに対して適切なマッピングが設定されていれば、次のユーザーインターフェイスが表示されます。

Struts Simple UI tags

示されているように、s：headは、Struts2アプリケーションに必要なjavascriptおよびスタイルシート要素を生成します。

次に、s：div要素とs：text要素があります。 s：divは、HTML Div要素をレンダリングするために使用されます。これは、HTMLタグとStrutsタグを混在させたくない人に役立ちます。それらの人々のために、彼らはdivをレンダリングするためにs：divを使用する選択肢があります。

示されているs：textは、画面上にテキストをレンダリングするために使用されます。

次に、使い慣れたs：formタグがあります。 s：formタグには、フォームを送信する場所を決定するアクション属性があります。フォームにファイルアップロード要素があるため、enctypeをmultipartに設定する必要があります。それ以外の場合は、これを空白のままにします。

formタグの最後に、s：submitタグがあります。これは、フォームを送信するために使用されます。フォームが送信されると、すべてのフォーム値がs：formタグで指定されたアクションに送信されます。

s：formの中には、secretという隠し属性があります。これにより、HTMLの非表示要素がレンダリングされます。この場合、「secret」要素の値は「abracadabra」です。この要素はエンドユーザーには表示されず、あるビューから別のビューに状態を伝えるために使用されます。

次に、s：label、s：textfield、s：password、およびs：textareaタグがあります。これらは、それぞれラベル、入力フィールド、パスワード、およびテキスト領域のレンダリングに使用されます。これらは、「Struts-電子メールの送信」の例で実際に使用されています。

ここで注意すべき重要なことは、「キー」属性の使用です。「key」属性は、プロパティファイルからこれらのコントロールのラベルを取得するために使用されます。この機能については、Struts2のローカライズ、国際化の章ですでに説明しています。

次に、入力ファイルアップロードコンポーネントをレンダリングするs：fileタグがあります。このコンポーネントにより、ユーザーはファイルをアップロードできます。この例では、s：fileタグの「accept」パラメーターを使用して、アップロードできるファイルの種類を指定しています。

最後に、s：tokenタグがあります。トークンタグは、フォームが二重送信されたかどうかを確認するために使用される一意のトークンを生成します

フォームがレンダリングされると、隠し変数がトークン値として配置されます。たとえば、トークンが「ABC」であるとしましょう。このフォームが送信されると、Struts Fitlerはトークンをセッションに保存されているトークンと照合します。一致する場合、セッションからトークンを削除します。これで、フォームを誤って再送信した場合（更新またはブラウザの戻るボタンを押すことにより）、フォームはトークンとして「ABC」で再送信されます。この場合、フィルターはセッションに保存されているトークンに対してトークンを再度チェックします。ただし、トークン「ABC」はセッションから削除されているため、一致せず、Strutsフィルターは要求を拒否します。

グループUIタグ

グループUIタグは、ラジオボタンとチェックボックスを作成するために使用されます。チェックボックスとラジオボタンタグを備えた HelloWorld.jsp のシンプルなビューページを見てみましょう-

<%@ page contentType = "text/html; charset = UTF-8"%>
<%@ taglib prefix = "s" uri = "/struts-tags"%>

<html>
   <head>
      <title>Hello World</title>
      <s:head/>
   </head>

   <body>
      <s:form action = "hello.action">
         <s:radio label = "Gender" name = "gender" list="{'male','female'}"/>
         <s:checkboxlist label = "Hobbies" name = "hobbies"
         list = "{'sports','tv','shopping'}"/>
      </s:form>

   </body>
</html>

上記のプログラムを実行すると、出力は次のようになります-

StrutsグループUIタグ

ここで例を見てみましょう。最初の例では、ラベル「性別」を持つ単純なラジオボタンを作成しています。 name属性はラジオボタンタグに必須であるため、「性別」という名前を指定します。次に、性別にリストを提供します。リストには、値「male」および「female」が入力されます。したがって、出力では、2つの値を持つラジオボタンを取得します。

2番目の例では、チェックボックスリストを作成しています。これは、ユーザーの趣味を収集することです。ユーザーは複数の趣味を持つことができるため、ラジオボタンの代わりにチェックボックスを使用しています。チェックボックスには、「スポーツ」、「テレビ」、「ショッピング」のリストが表示されます。これにより、趣味がチェックボックスリストとして表示されます。

UIタグを選択

Strutsが提供するSelectタグのさまざまなバリエーションを調べてみましょう。 selectタグを使用した簡単なビューページ HelloWorld.jsp を見てみましょう-

<%@ page contentType = "text/html; charset = UTF-8"%>
<%@ taglib prefix = "s" uri = "/struts-tags"%>

<html>
   <head>
      <title>Hello World</title>
      <s:head/>
   </head>

   <body>
      <s:form action = "login.action">
         <s:select name = "username" label = "Username"
            list = "{'Mike','John','Smith'}"/>

         <s:select label = "Company Office" name = "mySelection"
            value = "%{'America'}" list="%{#{'America':'America'}}">
            <s:optgroup label = "Asia"
               list = "%{#{'India':'India','China':'China'}}"/>
            <s:optgroup label = "Europe"
               list="%{#{'UK':'UK','Sweden':'Sweden','Italy':'Italy'}}"/>
         </s:select>

         <s:combobox label = "My Sign" name = "mySign"
            list = "#{'aries':'aries','capricorn':'capricorn'}" headerkey = "-1"
            headervalue = "--- Please Select ---" emptyOption = "true" value = "capricorn"/>
         <s:doubleselect label = "Occupation" name = "occupation"
            list = "{'Technical','Other'}" doublename = "occupations2"
            doubleList="top == 'Technical' ?
            {'I.T', 'Hardware'} : {'Accounting', 'H.R'}"/>
      </s:form>
   </body>
</html>

上記のプログラムを実行すると、出力は次のようになります-

Struts選択UIタグ

それでは、個々のケースを1つずつ見ていきましょう。

最初に、選択タグはHTML選択ボックスをレンダリングします。最初の例では、名前が「username」でラベルが「username」の単純な選択ボックスを作成しています。選択ボックスには、Mike、John、Smithという名前のリストが表示されます。
2番目の例では、当社にアメリカに本社があります。また、アジアとヨーロッパにグローバルオフィスがあります。選択ボックスにオフィスを表示したいのですが、大陸の名前でグローバルオフィスをグループ化します。これは、optgroupが便利な場所です。 s：optgroupタグを使用して、新しいグループを作成します。グループにラベルと個別のリストを与えます。
3番目の例では、コンボボックスが使用されます。コンボボックスは、入力フィールドと選択ボックスの組み合わせです。ユーザーは、選択ボックスから値を選択できます。その場合、ユーザーが選択した値が入力フィールドに自動的に入力されます。ユーザーが値を直接入力する場合、選択ボックスの値は選択されません。
この例では、コンボボックスに太陽の兆候がリストされています。選択ボックスには4つのエントリのみがリストされ、リストにない場合はユーザーが太陽記号を入力できます。また、選択ボックスにヘッダーエントリを追加します。ヘッダーエントリは、選択ボックスの上部に表示されるものです。この例では、「選択してください」を表示します。ユーザーが何も選択しない場合、値として-1が想定されます。場合によっては、ユーザーに空の値を選択させたくないことがあります。これらの条件では、「emptyOption」プロパティをfalseに設定します。最後に、この例では、コンボボックスのデフォルト値として「山羊座」を指定します。
4番目の例では、二重選択があります。 2つの選択ボックスを表示する場合は、二重選択が使用されます。最初の選択ボックスで選択した値によって、2番目の選択ボックスに表示されるものが決まります。この例では、最初の選択ボックスに「技術」と「その他」が表示されます。ユーザーが技術を選択すると、2番目の選択ボックスにITとハードウェアが表示されます。それ以外の場合は、経理と人事を表示します。これは、例に示すように「list」および「doubleList」属性を使用して可能です。

上記の例では、上部の選択ボックスがテクニカルに等しいかどうかを確認するために比較を行いました。存在する場合は、ITとハードウェアを表示します。

また、上部のボックス（ "name = 'Occupations'）と下部のボックス（doubleName = 'occupations2'）に名前を付ける必要があります。

Struts-2-struts-form-tags

Struts 2-フォームタグ

シンプルなUIタグ

グループUIタグ

UIタグを選択

目次