ご覧のページは、お客様の利便性のために一部機械翻訳されています。また、ドキュメントは頻繁に更新が加えられており、翻訳は未完成の部分が含まれることをご了承ください。最新情報は都度公開されておりますため、必ず英語版をご参照ください。翻訳に問題がある場合は、こちらまでご連絡ください。

AUIタグを使ったフォームの構築

AUI タグライブラリは、アプリケーションのフォームを構築するために必要なすべてのコンポーネントを提供します。 AUIタグは、標準的なフォーム要素に、カスタムネームスペーシング、ローカライゼーション、さらには入力値の検証などの多くの利点を提供します。複数の属性が用意されており、ユーザーが望む体験を実現することができます。

以下の手順で、AUIタグを使用してフォームを構築します。

ポートレットのauitaglib宣言を、view.jspに追加してください（まだの場合）。
```
<%@ taglib prefix="aui" uri="http://liferay.com/tld/aui" %>
```

以下のタグを使用してフォームを作成します。各タグは、対応するtaglibdocにリンクしており、利用可能な属性が記載されています。

以下にフォームの例を示します。

<aui:form name="fm">
	<aui:fieldset-group markupView="lexicon">
		<aui:fieldset label="Personal Information">
			<aui:row>
				<aui:col width="50">
					<aui:input label="First Name" name="firstName" type="text" />
				</aui:col>
				<aui:col width="50">
					<aui:input label="Last Name" name="lastName" type="text" />
				</aui:col>
			</aui:row>
			<aui:row>
				<aui:col width="50">
					<aui:input label="Username" name="username" type="text" />
				</aui:col>
				<aui:col width="50">
					<aui:input label="Email" name="email" type="email" />
				</aui:col>
			</aui:row>
		</aui:fieldset>
	</aui:fieldset-group>
	<aui:fieldset-group markupView="lexicon">
		<aui:fieldset label="Miscellaneous">
			<aui:input label="Hobbies" name="hobbies" type="textarea" />
			<aui:input label="Receive email updates" name="emailUpdates" type="checkbox" />
		</aui:fieldset>
	</aui:fieldset-group>
	<aui:button-row>
		<aui:button name="submitButton" type="submit" value="Submit" />
	</aui:button-row>
</aui:form>

AUIタグは、アプリケーションのフォームを作成するために必要なすべてを提供します。

オプションで、フォーム項目に入力値の検証を追加します。検証する各フォームフィールド内に <aui:validator> タグをネストします。 <aui:validator>タグのname属性で入力値の検証ルールを指定します（利用できる入力値の検証ルールは下表の通りです）。 errorMessage属性で、フィールドのデフォルトの検証エラーメッセージをオーバーライドすることができます。以下に構成例を示します。
```
<aui:form name="myForm">
    <aui:input name="password" id="password" label="Password"
    required="true" />
    <aui:input name="confirmPassword" id="password"
    label="Confirm Password" required="true">
        <aui:validator name="equalTo"
        errorMessage="The passwords much match. Please try again." >
        '#<portlet:namespace>password'
        </aui:validator>
    </aui:input>
</aui:form>
```

利用可能な入力値の検証ルールの全リストは、以下の表に示すとおりです。

ルール	Description	デフォルトのメッセージ
`acceptFiles`	フィールドが指定されたファイル形式のみを含むことができることを指定する。各ファイルの拡張子はカンマで区切る必要があります。例えば `<aui:validator name="acceptFiles">'jpg,png,tif,gif'</aui:validator>`	‘有効な拡張子 ([サポートされている拡張子]) を持つファイルを入力してください。'
`alpha`	アルファベットの使用を許可します	‘英字のみを入力してください。'
`alphanum`	英数字を許可します	‘英数字のみを入力してください。'
`date`	日付を許可します	‘有効な日付を入力してください。'
`digits`	数字を許可します	‘数字のみ入力してください。'
`email`	メールアドレスを許可します	‘有効なメールアドレスを入力してください。'
`equalTo`	指定されたフィールド IDを持つ他のフィールドと等しい内容を許可します。例えば、 `<aui:validator name="equalTo">'#<portlet:namespace/>パスワード'</aui:validator>`	‘同じ値をもう一度入力してください。'
`max`	指定された値より小さい整数値を許可します。例えば、最大値20は `<aui:validator name="max">20</aui:validator>`で指定されます。	‘[最大値]以下の値を入力してください。'
`maxLength`	指定されたサイズの最大フィールド長を許可します（ `max`と同じ構文に従う）。	‘[max] 文字以内で入力してください。'
`min`	指定された最小値よりも大きな整数値を許可します（ `max`と同じ構文に従う）。	‘[最小値]以上の値を入力してください。'
`minLength`	指定されたサイズより長いフィールド長を許可します（ `max`と同じ構文に従います）。	‘少なくとも [min] 文字を入力してください。'
`number`	数値を許可します	‘有効な番号を入力してください。'
`range`	指定された範囲内の数値を許可します。例えば、1.23から10までの範囲はここで指定されます `<aui:validator name="range">[1.23,10]</aui:validator>`	‘[0]から[1]までの値を入力してください。'
`rangeLength`	指定された範囲内のフィールド長を許可します（ `range`と同じ構文に従う）	‘[0]～[1]文字までの値を入力してください。'
`required`	空白のフィールドを防ぎます	‘このフィールドは必須です。'
`url`	URLの値を許可します	‘有効な URL を入力してください。'