CakePHP3 HTMLラジオボタンでlabelの位置がCakePHP2と違う。inputタグを制御できない

カテゴリー：CakePHP3

記事作成日：2017-05-08

CakePHP3.4.6　Formヘルパーでinputタグを出力した時にCakePHP2の様には制御できない？できなくなったのかバグなのか？

**CakePHP3では仕様が変更になった。でも安心しましょう。**

# CakePHP3ではFormヘルパーがより便利になった

最初に気付いたのは、ラジオボタンのラベルタグの位置。

```html

<input type="radio" id="id1"><label for="id1">ラジオボタン</label>

<label for="id1"><input type="radio" id="id1">ラジオボタン</label>
```

困ったのはこの配置だとCSSでボタンを装飾しているのが効かなくなったし、目的の装飾にすることが出来なくなった。

一気にCakePHP3が嫌いになるところだったが、調べると見つかった。

# 答えはここに。 CORE/src/View/Helper/FormHelper.php

```php
'templates' => [
    'button' => '<button{{attrs}}>{{text}}</button>',
    'checkbox' => '<input type="checkbox" name="{{name}}" value="{{value}}"{{attrs}}>',
    'checkboxFormGroup' => '{{label}}',
    'checkboxWrapper' => '<div class="checkbox">{{label}}</div>',
    'dateWidget' => '{{year}}{{month}}{{day}}{{hour}}{{minute}}{{second}}{{meridian}}',
    'error' => '<div class="error-message">{{content}}</div>',
    'errorList' => '<ul>{{content}}</ul>',
    'errorItem' => '<li>{{text}}</li>',
    'file' => '<input type="file" name="{{name}}"{{attrs}}>',
    'fieldset' => '<fieldset{{attrs}}>{{content}}</fieldset>',
    'formStart' => '<form{{attrs}}>',
    'formEnd' => '</form>',
    'formGroup' => '{{label}}{{input}}',
    'hiddenBlock' => '<div style="display:none;">{{content}}</div>',
    'input' => '<input type="{{type}}" name="{{name}}"{{attrs}}/>',
    'inputSubmit' => '<input type="{{type}}"{{attrs}}/>',
    'inputContainer' => '<div class="input {{type}}{{required}}">{{content}}</div>',
    'inputContainerError' => '<div class="input {{type}}{{required}} error">{{content}}{{error}}</div>',
    'label' => '<label{{attrs}}>{{text}}</label>',
    'nestingLabel' => '{{hidden}}<label{{attrs}}>{{input}}{{text}}</label>',
    'legend' => '<legend>{{text}}</legend>',
    'multicheckboxTitle' => '<legend>{{text}}</legend>',
    'multicheckboxWrapper' => '<fieldset{{attrs}}>{{content}}</fieldset>',
    'option' => '<option value="{{value}}"{{attrs}}>{{text}}</option>',
    'optgroup' => '<optgroup label="{{label}}"{{attrs}}>{{content}}</optgroup>',
    'select' => '<select name="{{name}}"{{attrs}}>{{content}}</select>',
    'selectMultiple' => '<select name="{{name}}[]" multiple="multiple"{{attrs}}>{{content}}</select>',
    'radio' => '<input type="radio" name="{{name}}" value="{{value}}"{{attrs}}>',
    'radioWrapper' => '{{label}}',
    'textarea' => '<textarea name="{{name}}"{{attrs}}>{{value}}< /textarea>',
    'submitContainer' => '<div class="submit">{{content}}</div>',
]
```

ここを変更すると各種デフォルトを変更できる。いや、**コアを触ってはいけない**。

# この部分を抜き出してView/AppView.phpに記述

実装例：View/AppView.php

```php
namespace App\View;

use Cake\View\View;

class AppView extends View {
	public function initialize() {
		$this->Form->templates([
			'fieldset' => '{{content}}',
			'label' => '',
			'nestingLabel' => '{{hidden}}{{input}}<label{{attrs}}>{{text}}</label>',
			'legend' => '',
			'multicheckboxTitle' => '',
			'multicheckboxWrapper' => '{{content}}',
			'radioWrapper' => '<span class="radio">{{label}}</span>',
			'submitContainer' => '{{content}}',
		]);
	}
}
```

これで全てのFormで一括指定できる。
いちいち 'legend'=>false とか、'label'=>false と書かなくてもいいし、'div'=>false もそうだが余計なタグは一掃できる。

# 個別に指定したい場合

テンプレートの .ctp 単位に書きたい場合は、.ctpの上部に以下の通り必要な項目を書き入れればよい。

```php
$this->Form->templates([
	'fieldset' => '{{content}}',
	'label' => '',
	'nestingLabel' => '{{hidden}}{{input}}<label{{attrs}}>{{text}}</label>',
	'legend' => '',
]);
?>
```

# タグ単位に指定する方法

タグ単位に指定する方法も有るらしいので、必要ならば調べてほしい。

# new FormHelper() の場合はどうなる

Viewのインスタンスを指定してFormHelperのインスタンスを作成した場合、以下の様にtemplatesに入れてやればいい。

```php
$view = new View();
$form = new FormHelper($view);
$form->templates(['submitContainer'=>'{{content}}']);
```

**一括して指定できるので、\*.ctp ファイルは非常にすっきりと書ける。**

CONTENTS

Android

Androidアプリの合計ダウンロード数、iOSアプリの合計ダウンロード数

Flutter

Android Studio. Could not determine java version. Unable to find bundled Java version.

その他