フォームヘルパーを利用する (4/5)
作成:2015-09-05 09:23
更新:2015-09-05 09:23
更新:2015-09-05 09:23
■ラジオボタン/セレクト項目の生成
先ほどの説明で、あえて省いておいたフォーム部品があります。それは「ラジオボタン」と「セレクト」です。
これらは、複数の項目を持つ、複雑な構造の部品です。このため、作成するメソッドの使い方も、他のものとは若干違っています。
以下に、使い方をまとめておきましょう。
・ラジオボタン
・セレクト
他のタグ生成メソッドと異なり、第2引数には、表示する項目の情報を連想配列としてまとめたものを用意します。オプション設定(属性の値などを設定するためのもの)を用意する場合は、第3引数に用意します。
問題は、表示する項目の情報をどう用意するか、でしょう。これは、1つ1つの項目の情報をまとめた連想配列の連想配列になります。ざっとこんな感じですね。
表示項目は、最低限、'value'と'text'が必要でしょう。valueが、その項目を選択した時の値となり、textが項目として表示されるテキストになります。
では、簡単なサンプルを挙げておきましょう。ラジオボタンと2つのセレクトを表示するサンプルです(下のリスト参照)。作成されたフォームを実際に触って動作を確かめてみましょう。
ラジオボタンは、項目の情報を元に、<input type="radio">タグと、それにテキストを表示する<label>タグがセットで生成されます。
セレクトは、ここでは複数項目を選択するのに、['multiple'=>true]という値を第3引数に指定しています。すると、自動的に一覧リストの形で表示されることがわかります。これを付けず、1つだけが選択される場合は、自動的にポップアップメニューのスタイルになります。
もちろん、第3引数にsize属性などを用意すればポップアップメニューとリスト表示を明示的に設定することもできますが、「multipleかどうかで自動的に切り替えてくれる」というのはなかなか便利ですね!
これらは、複数の項目を持つ、複雑な構造の部品です。このため、作成するメソッドの使い方も、他のものとは若干違っています。
以下に、使い方をまとめておきましょう。
・ラジオボタン
<?=$this->Form->radio( 名前 , [ ボタン情報 ]) ?>
・セレクト
<?=$this->Form->select( 名前 , [ 項目情報 ]) ?>
他のタグ生成メソッドと異なり、第2引数には、表示する項目の情報を連想配列としてまとめたものを用意します。オプション設定(属性の値などを設定するためのもの)を用意する場合は、第3引数に用意します。
問題は、表示する項目の情報をどう用意するか、でしょう。これは、1つ1つの項目の情報をまとめた連想配列の連想配列になります。ざっとこんな感じですね。
[
['value'=> 値, 'text'=> 表示テキスト ] ,
['value'=> 値, 'text'=> 表示テキスト ] ,
……略……
]
表示項目は、最低限、'value'と'text'が必要でしょう。valueが、その項目を選択した時の値となり、textが項目として表示されるテキストになります。
では、簡単なサンプルを挙げておきましょう。ラジオボタンと2つのセレクトを表示するサンプルです(下のリスト参照)。作成されたフォームを実際に触って動作を確かめてみましょう。
ラジオボタンは、項目の情報を元に、<input type="radio">タグと、それにテキストを表示する<label>タグがセットで生成されます。
セレクトは、ここでは複数項目を選択するのに、['multiple'=>true]という値を第3引数に指定しています。すると、自動的に一覧リストの形で表示されることがわかります。これを付けず、1つだけが選択される場合は、自動的にポップアップメニューのスタイルになります。
もちろん、第3引数にsize属性などを用意すればポップアップメニューとリスト表示を明示的に設定することもできますが、「multipleかどうかで自動的に切り替えてくれる」というのはなかなか便利ですね!
(by. SYODA-Tuyano.)
※プログラムリストが表示されない場合
AddBlockなどの広告ブロックツールがONになっていると、プログラムリスト等が表示されない場合があります。これらのツールをOFFにしてみてください。
●プログラム・リスト●
<div> <h3>Index Page</h3> <p><?= $message ?></p> <?=$this->Form->create(null,[ 'type' => 'post', 'url' => ['controller' => 'Helo', 'action' => 'index']] ) ?> <?=$this->Form->radio('radio',[ ['value'=>'男','text'=>'male','checked'=>true], ['value'=>'女','text'=>'female'] ]) ?> <?=$this->Form->select('select',[ ['value'=>'Mac','text'=>'Mac OS X'], ['value'=>'Windows','text'=>'Windows 10'], ['value'=>'Linux','text'=>'Linux'] ]) ?> <?=$this->Form->select('select2',[ ['value'=>'Mac','text'=>'Mac OS X'], ['value'=>'Windows','text'=>'Windows 10'], ['value'=>'Linux','text'=>'Linux'] ],['multiple'=>true]) ?> <?=$this->Form->submit('OK') ?> <?=$this->Form->end() ?> </form> </div>
※関連コンテンツ
「初心者のためのCakePHP3 プログラミング入門」に戻る