スポンサードリンク

CakePHP
CakePHP

Formヘルパーを使ってラジオボタンを作る方法です。

作ったはいいですが、

結局、使わなかったのでw

覚書として書いておきます。

スポンサードリンク

ラジオボタンの作り方

まず、コントローラーでラジオボタンに使うデータを用意します。

(例)PostsController.php

$radio = $this->Post->find('list', array('fields' => array('id', 'title')));
$this->set('radio', $radio);

次に、ビューでラジオボタンを実装します。

(例)Posts/add.ctp

$this->Form->input('title', array(
                         'legend' => false,
                         'type' => 'radio',
                         'options' => $radio
));
ラジオボタン
ラジオボタン

オプションで「’legend’ => false」としていうのは

ラベルのようなものができてしまうので

消すためにfalseにしています。

使うことあるのかな?

また、初期値を設定しておきたいときは

(例)Posts/add.ctp

$this->Form->input('title', array(
                         'legend' => false,
                         'type' => 'radio',
                         'value' => 1,
                         'options' => $radio
));

配列の中にvalueで値を渡しておくと、

それが初期値として設定されます。

上記の形だとvalueが「1」のものを選んだ状態になります。

あと、初期ではラジオボタンが縦並びになるので

横並びにする場合はfloatを使った方がいいです。

ラジオボタンとラベルをDIVタグでまとめてfloatするといいかも

ラジオボタンを横並びにする方法

ラジオボタンとラベルをdivタグでまとめる方法です。

(例)Posts/add.ctp

$this->Form->input('title', array(
                                'legend' => false,
                                'type' => 'radio',
                                'options' => $radio,
                                'before' => '<div class="radio">',
                                'after' => '</div>',
                                'separator' => '</div><div class="radio">'
                   ));

と上記の様に書きます。

オプションの’before’はラジオボタンが始まる

最初の場所に指定の文字を入れます。

’after’は逆でラジオボタンが終わる

場所に指定の文字を入れます。

’separator’はinputとlabelタグの間に文字を入れてくれます。

次にCSSでradioクラスにfloatを付けてあげれば

.radio{ float: left; }
ラジオボタン横並び
ラジオボタン横並び

このように横並びになります。

後はCSSで微調整すれば問題ないかと。

スポンサードリンク

’div’=> falseをつけると・・・

(例)Posts/add.ctp

$this->Form->input('title', array(
                                'legend' => false,
                                'type' => 'radio',
                                'options' => $radio,
                                'div' => false
                   ));
divタグ無し
divタグ無し

「’div’ => false」を追加すると

これから付けようとするdivタグも無効かされるのでご注意を!

Formヘルパーはすごく便利なので

使うとやめられなくなるかもw

(参考)
FormHelper

スポンサードリンク