2015.05.11

CakePHP

cakephp2.x系 inputフォームヘルパー classについて

echo $this->Form->input('field', array(
    'label' => array(
        'class' => 'label_class'   // labelタグに付与するclass (※1)
    ),
    'div' => array(
        'class' => 'wrapper_input' // divタグに付与するclass (※2)
    ),
    'class' => 'input_class'       // inputタグに付与するclass (※3)
));

上記の記述でhtml出力は

<div class="wrapper_input"><label for="field" class="label_class">Field</label><input name="data[field]" class="input_class" type="text" id="field"/></div>

になります。

デフォルト(class記述なし)では

<div class="input text"><label for="field">Field</label><input name="data[field]" type="text" id="field"/></div>

となります。

要約しますと
※1はlabelで使用されるクラスとなり、
※2はlabel、inputを包含したdivのクラス、
※3はinputのクラスとなります。

※2について
もし、css等で”input”というクラス名を用いてレイアウトを行っていた場合は若干注意が必要です。

上記のデフォルトhtml出力では”input text”がクラス名として記述されています。
これに対して”wrapper_input”のようにクラス名を付与した場合、デフォルトの”input text”がなくなり、
“wrapper_input”のみとなってしまいます。

デフォルトのクラス名を付与させつつ、新規でクラス名を追加する場合は配列で記述します。

echo $this->Form->input('field', array(
    'label' => array(
        'class' => 'label_class'
    ),
    'div' => array(
        'class' => array('input', 'text', 'wrapper_input'), // <= 配列で記述
    ),
    'class' => 'input_class' 
));

html出力は以下のようになります。

<div class="input text wrapper_input"><label for="field" class="label_class">Field</label><input name="data[field]" class="input_class" type="text" id="field"/></div>