Welcome to the Cookbook

loading...

7.3.3 フォーム要素の自動生成

The original text for this section has changed since it was translated. Please help resolve this difference. You can:

More information about translations

はじめに、フォームを自動的に作成する FormHelper のいくつかのメソッドを見ていきましょう。主なメソッドは input() です。このメソッドは各フィールドに適切な input を生成するために、自動的に提供されたモデルのフィールドを確認します。

input(string $fieldName, array $options = array())
カラム型フォームフィールドの結果
string (char, varchar, etc.)text
boolean, tinyint(1)checkbox
texttextarea
text, with name of password, passwd, or pswordpassword
date日、月、そして年の select
datetime, timestamp日、月、年、時、分そして子午線の select
time時、分そして子午線の select

例として、 User モデルに「username」(varchar)、「password」(varchar)、「approved」(datetime)、「quote」(text) というフィールドが存在するとしましょう。これらの各フォームフィールドに適切な input を作成するために、 FormHelper の input() メソッドを使用します。

<?php echo $form->create(); ?>
 
    <?php
        echo $form->input('username');   //text
        echo $form->input('password');   //password
        echo $form->input('approved');   //日、月、年、時間、分そして子午線
        echo $form->input('quote');      //textarea
    ?>
 
<?php echo $form->end('Add'); ?>
  1. <?php echo $form->create(); ?>
  3. <?php
  4. echo $form->input('username'); //text
  5. echo $form->input('password'); //password
  6. echo $form->input('approved'); //日、月、年、時間、分そして子午線
  7. echo $form->input('quote'); //textarea
  8. ?>
  10. <?php echo $form->end('Add'); ?>

date フィールドはたくさんのオプションを持ちます。例を見てみましょう。

        echo $form->input('birth_dt', array( 'label' => 'Date of birth'
                                    , 'dateFormat' => 'DMY'
                                    , 'minYear' => date('Y') - 70
                                    , 'maxYear' => date('Y') - 18 ));
  1. echo $form->input('birth_dt', array( 'label' => 'Date of birth'
  2. , 'dateFormat' => 'DMY'
  3. , 'minYear' => date('Y') - 70
  4. , 'maxYear' => date('Y') - 18 ));

仕上げに、 hasAndBelongsToMany の select を生成する例を示します。User が Group に hasAndBelongsToMany のアソシエーションを持っていると仮定します。コントローラで、キャメル記法で複数形の変数(この例では group -> groups あるいは ExtraFunkyModel -> extraFunkyModels)を select オプションにセットしてください。コントローラアクション中で次のようにします。

$this->set('groups', $this->User->Group->find('list'));
  1. $this->set('groups', $this->User->Group->find('list'));

そして view での複数選択が簡単なコードで作成できるはずです。

echo $form->input('Group');
  1. echo $form->input('Group');

belongsTo あるいは hasOne の関連において、select フィールドを生成するなら、Users コントローラに次のコードを追加してください(User belongsTo Group とします)。:

$this->set('groups', $this->User->Group->find('list'));
  1. $this->set('groups', $this->User->Group->find('list'));

その後に、フォームを作成するビューに、次のコードを追加してください。

echo $form->input('group_id');
  1. echo $form->input('group_id');

7.3.3.1 フィールドの命名に関する慣習

フォームヘルパーはとてもスマートです。フォームヘルパーのメソッドでフィールドの命名規則を定義する時はいつでも、input タグを構築するにあたり現在使用しているモデルの名前を使用します。例えば次のようになります。

<input type="text" id="ModelnameFieldname" name="data[Modelname][fieldname]">
  1. <input type="text" id="ModelnameFieldname" name="data[Modelname][fieldname]">

第一引数として Modelname.fieldname という形式を渡すことで、手動でモデル名を定義することができます。

echo $form->input('Modelname.fieldname');
  1. echo $form->input('Modelname.fieldname');

同じフィールド名を使って複数のフィールドを定義する場合、次のような方法で配列を生成すると、 saveAll() で一度に保存することができます。

<?php 
   echo $form->input('Modelname.0.fieldname');
   echo $form->input('Modelname.1.fieldname');
?>

<input type="text" id="Modelname0Fieldname" name="data[Modelname][0][fieldname]">
<input type="text" id="Modelname1Fieldname" name="data[Modelname][1][fieldname]">
  1. <?php
  2. echo $form->input('Modelname.0.fieldname');
  3. echo $form->input('Modelname.1.fieldname');
  4. ?>
  5.  
  6. <input type="text" id="Modelname0Fieldname" name="data[Modelname][0][fieldname]">
  7. <input type="text" id="Modelname1Fieldname" name="data[Modelname][1][fieldname]">

7.3.3.2 $options[‘type’]

The original text for this section has changed since it was translated. Please help resolve this difference. You can:

More information about translations

型を定義することで、 input タグの型を強制的にそれにし、モデルが持つフィールドの型も上書きします。テーブルで定義されうる型に加え、「file」と「password」の入力フィールドを作成することもできます。

<?php echo $form->input('field', array('type' => 'file')); ?>
 
Output:
 
<div class="input">
    <label for="UserField">Field</label>
    <input type="file" name="data[User][field]" value="" id="UserField" />
</div>
  1. <?php echo $form->input('field', array('type' => 'file')); ?>
  3. Output:
  5. <div class="input">
  6. <label for="UserField">Field</label>
  7. <input type="file" name="data[User][field]" value="" id="UserField" />
  8. </div>

7.3.3.3 $options[‘before’], $options[‘between’], $options[‘separator’] and $options[‘after’]

input() メソッドの出力の中に、何か記述を挿入する必要がある場合は、これらのキーを使用してください。

<?php echo $form->input('field', array(
    'before' => '--before--',
    'after' => '--after--',
    'between' => '--between---'
));?>
 
Output:
 
<div class="input">
--before--
<label for="UserField">Field</label>
--between---
<input name="data[User][field]" type="text" value="" id="UserField" />
--after--
</div>
  1. <?php echo $form->input('field', array(
  2. 'before' => '--before--',
  3. 'after' => '--after--',
  4. 'between' => '--between---'
  5. ));?>
  7. Output:
  9. <div class="input">
  10. --before--
  11. <label for="UserField">Field</label>
  12. --between---
  13. <input name="data[User][field]" type="text" value="" id="UserField" />
  14. --after--
  15. </div>

「separator」属性はラジオボタンを作成するときに使用し、各 input/label ペアの間に記述を挿入することができます。

<?php echo $form->input('field', array(
    'before' => '--before--',
    'after' => '--after--',
    'between' => '--between---',
    'separator' => '--separator--',
    'options' => array('1', '2') 
));?>
 
Output:
 
<div class="input">
--before--
<input name="data[User][field]" type="radio" value="1" id="UserField1" />
<label for="UserField1">1</label>
--separator--
<input name="data[User][field]" type="radio" value="2" id="UserField2" />
<label for="UserField2">2</label>
--between---
--after--
</div>
  1. <?php echo $form->input('field', array(
  2. 'before' => '--before--',
  3. 'after' => '--after--',
  4. 'between' => '--between---',
  5. 'separator' => '--separator--',
  6. 'options' => array('1', '2')
  7. ));?>
  9. Output:
  11. <div class="input">
  12. --before--
  13. <input name="data[User][field]" type="radio" value="1" id="UserField1" />
  14. <label for="UserField1">1</label>
  15. --separator--
  16. <input name="data[User][field]" type="radio" value="2" id="UserField2" />
  17. <label for="UserField2">2</label>
  18. --between---
  19. --after--
  20. </div>

7.3.3.4 $options[‘options’]

The original text for this section has changed since it was translated. Please help resolve this difference. You can:

More information about translations

このキーは select による入力、ラジオボタンのグループに対する定義を手動で行います。「type」が「radio」と定義されていない場合、 FormHelper は対象となる出力は select による入力フォームであると仮定します。

<?php echo $form->input('field', array('options' => array(1,2,3,4,5))); ?>
 
Output:
 
<div class="input">
    <label for="UserField">Field</label>
    <select name="data[User][field]" id="UserField">
        <option value="0">1</option>
        <option value="1">2</option>
        <option value="2">3</option>
        <option value="3">4</option>
        <option value="4">5</option>
    </select>
</div>
  1. <?php echo $form->input('field', array('options' => array(1,2,3,4,5))); ?>
  3. Output:
  5. <div class="input">
  6. <label for="UserField">Field</label>
  7. <select name="data[User][field]" id="UserField">
  8. <option value="0">1</option>
  9. <option value="1">2</option>
  10. <option value="2">3</option>
  11. <option value="3">4</option>
  12. <option value="4">5</option>
  13. </select>
  14. </div>

オプションはキーと値のペアで提供することもできます。

<?php echo $form->input('field', array('options' => array(
    'Value 1'=>'Label 1',
    'Value 2'=>'Label 2',
    'Value 3'=>'Label 3'
 ))); ?>

Output:
 
<div class="input">
    <label for="UserField">Field</label>
    <select name="data[User][field]" id="UserField">
        <option value="Value 1">Label 1</option>
        <option value="Value 2">Label 2</option>
        <option value="Value 3">Label 3</option>
    </select>
</div>
  1. <?php echo $form->input('field', array('options' => array(
  2. 'Value 1'=>'Label 1',
  3. 'Value 2'=>'Label 2',
  4. 'Value 3'=>'Label 3'
  5. ))); ?>
  6.  
  7. Output:
  9. <div class="input">
  10. <label for="UserField">Field</label>
  11. <select name="data[User][field]" id="UserField">
  12. <option value="Value 1">Label 1</option>
  13. <option value="Value 2">Label 2</option>
  14. <option value="Value 3">Label 3</option>
  15. </select>
  16. </div>

7.3.3.5 $options[‘multiple’]

select を出力するにあたり「multiple」が true にセットしてあった場合、その select の入力は複数選択が許可されます。「multiple」の代わりに「checkbox」を指定することで、関連したチェックボックスのリストを出力することができます。

$form->input('Model.field', array( 'type' => 'select', 'multiple' => true ));
$form->input('Model.field', array( 'type' => 'select', 'multiple' => 'checkbox' ));
  1. $form->input('Model.field', array( 'type' => 'select', 'multiple' => true ));
  2. $form->input('Model.field', array( 'type' => 'select', 'multiple' => 'checkbox' ));

7.3.3.6 $options[‘maxLength’]

text の input において許容する最大の文字列長を定義します。

7.3.3.7 $options[‘div’]

このオプションは input タグを内包する div タグの属性をセットします。文字列によって、 div タグの class の名前を指定します。配列をセットすると、 div の属性をその配列のキーと値でセットされます。これらの代わりに、このキーの値を false にセットすると div が出力されないようになります。

クラス名をセットする:

    echo $form->input('User.name', array('div' => 'class_name'));
  1. echo $form->input('User.name', array('div' => 'class_name'));

出力:

<div class="class_name">
	<label for="UserName">Name</label>
	<input name="data[User][name]" type="text" value="" id="UserName" />
</div>

複数の属性をセットする:

    echo $form->input('User.name', array('div' => array('id' => 'mainDiv', 'title' => 'Div Title', 'style' => 'display:block')));
  1. echo $form->input('User.name', array('div' => array('id' => 'mainDiv', 'title' => 'Div Title', 'style' => 'display:block')));

出力:

<div class="input text" id="mainDiv" title="Div Title" style="display:block">
	<label for="UserName">Name</label>
	<input name="data[User][name]" type="text" value="" id="UserName" />
</div>

div の出力を無効にする:

    <?php echo $form->input('User.name', array('div' => false));?>
  1. <?php echo $form->input('User.name', array('div' => false));?>

出力:

    <label for="UserName">Name</label>
    <input name="data[User][name]" type="text" value="" id="UserName" />

7.3.3.8 $options[‘label’]

このキーに文字列をセットすると、 input タグにいつも付いてくる label タグの中に、その文字列が表示されます。

<?php echo $form->input( 'User.name', array( 'label' => 'ユーザの別名' ) );?>
  1. <?php echo $form->input( 'User.name', array( 'label' => 'ユーザの別名' ) );?>

Output:

<div class="input">
    <label for="UserName">ユーザの別名</label>
    <input name="data[User][name]" type="text" value="" id="UserName" />
</div>

このキーに文字列の代わりに false をセットすると、 label タグの出力は無効化されます。

<?php echo $form->input( 'User.name', array( 'label' => false ) ); ?>
  1. <?php echo $form->input( 'User.name', array( 'label' => false ) ); ?>

Output:

<div class="input">
    <input name="data[User][name]" type="text" value="" id="UserName" />
</div>

label 要素に追加的なオプションを提供する場合は、配列をセットしてください。この場合、独自の label のテキストは、配列中の「text」キーを使用してください。

<?php echo $form->input( 'User.name', array( 'label' => array('class' => 'thingy', 'text' => 'ユーザの別名') ) ); ?>
  1. <?php echo $form->input( 'User.name', array( 'label' => array('class' => 'thingy', 'text' => 'ユーザの別名') ) ); ?>

Output:

<div class="input">
    <label for="UserName" class="thingy">ユーザの別名</label>
    <input name="data[User][name]" type="text" value="" id="UserName" />
</div>

7.3.3.9 $options['legend']

ラジオボタンのようないくつかの入力項目は、フィールド名から得られる見出しで自動的にラップされます。この見出しを legend オプションで上書きすることができます。このオプションを false にセットすると、フィールドセットを完全に消し去ります。

7.3.3.10 $options[‘id’]

このキーは input タグの DOM の id を指定します。

7.3.3.11 $options['error']

このキーを使うと、デフォルトのモデルのエラーメッセージを上書きすることができ、国際化したメッセージをセットするといった使い方をすることができます。 このオプションには、要素や要素クラス名のラッピングを制御するための、サブオプションがいくつかあります。

エラーメッセージの出力を行わないようにするには、「error」キーを false にします。

$form->input('Model.field', array('error' => false));
  1. $form->input('Model.field', array('error' => false));

要素をラップするタイプとそのクラス名を変更するには、次の書式を利用します。

$form->input('Model.field', array('error' => array('wrap' => 'span', 'class' => 'bzzz')));
  1. $form->input('Model.field', array('error' => array('wrap' => 'span', 'class' => 'bzzz')));

モデルのエラーメッセージを上書きするには、バリデーションルールをキーの名前にした連想配列を使います。

$form->input('Model.field', array('error' => array('tooShort' => __('This is not long enough', true) )));
  1. $form->input('Model.field', array('error' => array('tooShort' => __('This is not long enough', true) )));

前述したとおり、各バリデーションルールのエラーメッセージはモデル中でセットすることができます。追加的に、国際化したメッセージをフォームに用意することができます。

7.3.3.12 $options['default']

The original text for this section has changed since it was translated. Please help resolve this difference. You can:

More information about translations

select 型入力を組み合わせるために使用します。フォームがはじめに表示された時にデフォルトで選択された状態にする option をマークします。エラーが含まれたフォームの送信が行われた後は、選ばれた(あるいは変更された)値を保持します。

使用例: 

<?php 
    echo $form->input('country', array('options'=>$countries, 'default'=>'US')); 
?>
  1. <?php
  2. echo $form->input('country', array('options'=>$countries, 'default'=>'US'));
  3. ?>

7.3.3.13 $options[‘selected’]

The original text for this section has changed since it was translated. Please help resolve this difference. You can:

More information about translations

選択型の入力、つまりタイプが select, date, time, datetime の入力で使用します。入力する部分をレンダリングする時に selected 属性を設定して、デフォルトで選択状態にしたい項目の値を指定します。

echo $form->input('close_time', array('type' => 'time', 'selected' => '13:30:00'));
  1. echo $form->input('close_time', array('type' => 'time', 'selected' => '13:30:00'));

7.3.3.14 $options[‘rows’], $options[‘cols’]

The original text for this section has changed since it was translated. Please help resolve this difference. You can:

More information about translations

これらふたつのキーは textarea の入力項目において行と列の大きさを定義します。

7.3.3.15 $options[‘empty’]

このキーを true にセットすると、 input タグの値を必ず空にします。

select リストにこの値が渡された場合、空の値が入った空のオプションがドロップダウンリストに生成されます。 ブランクオプションを使わずに空の値の text の表示が必要なら、 string に空の文字列を渡してください。

<?php echo $form->input('field', array('options' => array(1,2,3,4,5), 'empty' => '(一つ選んでください)')); ?>
  1. <?php echo $form->input('field', array('options' => array(1,2,3,4,5), 'empty' => '(一つ選んでください)')); ?>

出力:

<div class="input">
    <label for="UserField">Field</label>
    <select name="data[User][field]" id="UserField">
        <option value="">(一つ選んでください)</option>
        <option value="0">1</option>
        <option value="1">2</option>
        <option value="2">3</option>
        <option value="3">4</option>
        <option value="4">5</option>
    </select>
</div>

パスワードフィールドのデフォルトの値を空にしたいなら、これの代わりに「'value' => ''」を使用してください。

オプションはキーと値のペアで渡すこともできます。

7.3.3.16 $options[‘timeFormat’]

時刻に関連した入力に関する select のフォーマットを定義します。有効な値は「12」、「24」そして「none」です。

7.3.3.17 $options[‘dateFormat’]

日付に関連した入力のセットに関する input タグのフォーマットを定義します。有効な値は「DMY」、「MDY」、「YMD」そして「NONE」です。

7.3.3.18 $options['minYear'], $options['maxYear']

date または datetime の入力に併せて使用します。 select フィールドに表示する最初と最後の年を定義します。

7.3.3.19 $options['interval']

このオプションは分のセレクトボックスにおいて、何分間隔を空けるのかを定義します。

<?php echo $form->input('Model.time', array('type' => 'time', 'interval' => 15)); ?>
  1. <?php echo $form->input('Model.time', array('type' => 'time', 'interval' => 15)); ?>

分を選ぶ欄に、15分ごとの4つの選択肢ができたはずです。

7.3.3.20 $options['class']

このセクションには保留されている変更があります. More information about translations

You can set the classname for an input field using $options['class']

echo $form->input('title', array('class' => 'custom-class'));
  1. echo $form->input('title', array('class' => 'custom-class'));
« フォームの終了 | File フィールド »