カテゴリー
コンピューター

CakePHP2 Form ヘルパーによるフォーム生成を勉強します♪

CakePHP フォームで別ページにデータを送る勉強します♪ | oki2a24 の続きになります。

まとめ

  • フォーム開始タグ生成
    $this->Form->create(保存先モデル名, フォームタグの属性とその値);
  • 入力フィールドタグ生成
    $this->Form->text(name 属性で指定される名前。「モデル名.フィールド名」が一般的)
  • チェックボックスタグ生成
    $this->Form->checkbox(name 属性で指定される名前, フォームタグの属性とその値)
  • ラベルタグ生成
    $this->Form->label(name 属性で指定される名前)
  • ラジオボタンタグ生成
    $this->Form->radio(name 属性で使用される名前, value と label の値の配列, Form ヘルパーの属性設定)
  • 選択リストタグの生成
    $this->Form->select(name 属性で使用される名前, value と画面に表示される値の配列, Form ヘルパーの属性設定)

前提

  • CakePHP 2.1.3 導入済み。
  • ドキュメントルート/cake/sample/（ここにCakePHP が入ってます。app ディレクトリとか、.travis.yml ファイルとか。）

ソース

cake/sample/app/Controller/HaskapController.php

<?php

class HaskapController extends AppController {

	// コントローラー名
	public $name = 'Haskap';
	// モデルを指定しない
	public $uses = null;
	// レイアウトとして使用するものを指定。Layouts フォルダの、haskap.ctp を使う。
	public $layout = 'Haskap';

	public function index() {
		App::uses('Sanitize', 'Utility');
		$result = '';

		if ($this->request->isPost()) {
			$result = '<pre>※送信された情報<br />';
			foreach ($this->request->data['HaskapForm'] as $key => $val) {
				$result .= $key . ' => ' . $val . '<br />';
			}
			$result .= '</pre>';
		} else {
			$result = '※何か書いて送信ボタンを押してねっ！';
		}
		$this->set('result', Sanitize::stripAll($result));
	}

}

?>

$this->request->isPost()　は　POST 送信があれば true を返します。つまり、「送信！」ボタンを押すと、この内部の処理を行います。逆に、初めての表示時は else 内の処理が行われます。

cake/sample/app/View/Haskap/index.ctp

<h1>サンプルのハスカップ見出し！</h1>
<p><?php echo $result; ?></p>
<br /><br />
<?php echo $this->Form->create(false, array('type' => 'post', 'action' => '.')); ?>
	<?php echo $this->Form->text('HaskapForm.text1'); ?>
	<br />
	<?php echo $this->Form->checkbox('HaskapForm.チェックボックス1', array('checked' => true)); ?>
	<?php echo $this->Form->label('HaskapForm.チェックボックス1'); ?>
	<br />
	<?php echo $this->Form->radio('HaskapForm.radio1',
		array('ウィンドウズ' => 'windows',
			'リナックス' => 'linux',
			'マックOS' => 'macosx'),
		array('legend' => 'OSを選択', 'value' => 'リナックス')
	); ?>
	<br />
	<?php echo $this->Form->select('HaskapForm.select1',
		array('ウィンドウズ' => 'windows',
			'リナックス' => 'linux',
			'マックOS' => 'macosx'),
		array('empty' => '項目を選んでください')
	); ?>
	<br />
	<?php echo $this->Form->submit('送信！'); ?>
<?php echo $this->Form->end(); ?>

上からまとめと同じ項目を設定しています。

結果

Haskap2.jpg

テキストなどに入力後、「送信！」ボタンを押した後の画面で問題が発生しました。

「※送信された情報」に表示されたチェックボックスの key が「チェックボックス1」となってしまっています。

これは、画面に表示させるチェックボックスの説明を「チェックボックス1」としたいために $this->Form->check(‘HaskapForm.チェックボックス1’) の内容と $this->Form->label(‘HaskapForm.チェックボックス1’) の内容を合わせたためです。HTML タグの name 属性が、全角、、、とても気持ちが悪いです。

本当は、key は半角英数で統一したいのですが、何かいい方法はないものでしょうか？以下、表示画面の HTML ソースです。

<!DOCTYPE HTML>
<html lang="ja-JP">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />	<title>
		Haskap	</title>
	<link rel="stylesheet" type="text/css" href="/cake/sample/css/cake.haskap.css" /></head>
<body>
	<div id="container">
		<div id="header">★★　ヘッダー！　★★</div>
		<div id="content">
			<h1>サンプルのハスカップ見出し！</h1>

<p><pre>※送信された情報<br />text1 => asdfあいうえお☆@[]:\\<br />チェックボックス1 => 1<br />radio1 => リナックス<br />select1 => ウィンドウズ<br /></pre></p>

<br /><br />

<form action="/cake/sample/haskap/." id="Form" method="post" accept-charset="utf-8"><div style="display:none;"><input type="hidden" name="_method" value="POST"/></div>

	<input name="data[HaskapForm][text1]" type="text" value="asdfあいうえお☆@[]:\\" id="HaskapFormText1"/>
	<br />

	<input type="hidden" name="data[HaskapForm][チェックボックス1]" id="HaskapFormチェックボックス1_" value="0"/>
	<input type="checkbox" name="data[HaskapForm][チェックボックス1]"  checked="checked" value="1" id="HaskapFormチェックボックス1"/>
	<label for="HaskapFormチェックボックス1">チェックボックス1</label>
	<br />

	<fieldset><legend>OSを選択</legend>
		<input type="radio" name="data[HaskapForm][radio1]" id="HaskapFormRadio1ウィンドウズ" value="ウィンドウズ" /><label for="HaskapFormRadio1ウィンドウズ">windows</label>
		<input type="radio" name="data[HaskapForm][radio1]" id="HaskapFormRadio1リナックス" value="リナックス" checked="checked" /><label for="HaskapFormRadio1リナックス">linux</label>
		<input type="radio" name="data[HaskapForm][radio1]" id="HaskapFormRadio1マックOS" value="マックOS" /><label for="HaskapFormRadio1マックOS">macosx</label>
	</fieldset>
	<br />

	<select name="data[HaskapForm][select1]" id="HaskapFormSelect1">
		<option value="">項目を選んでください</option>
		<option value="ウィンドウズ" selected="selected">windows</option>
		<option value="リナックス">linux</option>
		<option value="マックOS">macosx</option>
	</select>
	<br />

	<div class="submit"><input  type="submit" value="送信！"/></div>
</form>

		</div>
		<div id="footer">★★　フッター！　★★</div>
	</div>
</body>
</html>

ポイントは、チェックボックスです。前回の投稿でチェックボックスにチェックしなかった場合は値そのものが送信されませんでしたが、今回は違います。

Form ヘルパーが自動で hidden タグを生成し、チェックしないときも値を送信しています。

課題

$this->Form->label(name 属性で指定される名前) で「name 属性で指定される名前」を設定すると、画面に表示される文言も「name 属性で指定される名前」となってしまい、全角でラベルが表現できません。困りました！

追記　解決しました♪

以上です。

「CakePHP2 Form ヘルパーによるフォーム生成を勉強します♪」への4件の返信

コメントを残す