CakePHP1.3.6:フォーム・ヘルパー(Form Helper)をつかってみる。

今回は、以下のような画面をフォーム・ヘルパーで作ってみる。JavaEEをやっていた頃、Strutsのタグリブ(Taglib)で大はまりしたことがある。フォーム・ヘルパー(Form Helper)やHTMLヘルパー(HTML Helper)は、タグリブの臭いがするので、なんとなく気が進まなかったりする。
とりあえず、やってみよう。

ここで、サブミットすると、以下のようなレスポンスが帰る。
おもしろいのは、入力フィールドに値が残っていること。便利な機能だ。

プログラム名はTestFormHelperとする。

コントローラーの作成

/app/controllersにtest_form_helper.phpというファイルを作成する。

<?php

class TestFormHelperController extends AppController{
	
	public $name = 'TestFormHelper';
	public $uses = null;
	public $layout = 'myznala';
	public $autoLayout = true;
	public $autoRender = true;
	
	function index(){
		$this->set('title_for_layout', "フォームヘルパーのテスト");
		$rParm=null;
		if(!empty($this->data)){
			require_once '../vendors/MyConverter.class.php';
			$rParm = MyConverter::getRequestParams($this->data["TestForm"]);
		
		}
		$this->set("result",$rParm);
	}
	
}
?>

ビューを作成する。

/app/viewsにtest_form_helperディレクトリを作成し、以下のようなindex.ctpを配置した。
JSPで作成したコード(もしくは、PHPでベタ書きしたコード)のようでまことに不本意であるが、フォーム・ヘルパーのテストということで、以下のようなコードにしてみた。

<h1>CakePHPのサンプル</h1>
<p>
これはCakePHPのサンプル画面です。
</p>

<!-- 出力フィールド -->
<?php 
if($result){
	echo "<br>";
	echo "<table>";
	echo "<tr>";
	echo "<th>key</th>";
	echo "<th>value</th>";
	echo "</tr>";

	foreach($result as $key => $value){
		echo "<tr><td>";
		echo $key;
		echo "</td>";
		echo "<td>";
		echo $value;
		echo "</td></tr>";	
	}
	echo "</table><br>";
	echo "<hr>";
};
?>
<br>

<?php 
echo $form->create(null,array('type'=>'post','action'=>'.'));
echo $form->text("TestForm.text1");
echo '<br>';
echo $form->password("TestForm.text2");
echo '<br>';
echo $form->hidden("TestForm.hidden1",array('value'=>'hidden_value'));
echo '<br>';
echo $form->select("TestForm.select1",array('1'=>'1','2'=>'2','3'=>'3'),
				'3',array('empty'=>'選択してください'));
echo '<br>';
echo $form->checkbox("TestForm.check1",array('checked'=>'true'));
echo '<br>';
echo $form->checkbox("TestForm.check2",array('checked'=>'false'));
echo '<br>';
echo $form->radio("TestForm.radio1",array('a'=>'a','b'=>'b','c'=>'c'),
				array('legend'=>'ラジオ','value'=>'c'));
echo $form->end('送信');
?>
ソースの表示

2番目の画像のソースを表示すると、以下のようになっている。

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>
	フォームヘルパーのテスト</title>
<link rel="stylesheet" type="text/css" href="/workspace/cakesample/css/myznala.default.layout.css" /><link rel="stylesheet" type="text/css" href="/workspace/cakesample/css/myznala.layout.css" /><link rel="stylesheet" type="text/css" href="/workspace/cakesample/css/myznala.design.css" /></head>
<body>
<div id="egp-my-container">

	<div id="egp-my-header">
		<div class="egp-my-inner">
		<img src="/workspace/cakesample/img/obs.logo.gif" alt="openBusinessSuite" />2010-11-27      	</div>

	</div>

	<div id="egp-my-content">
		<div class="egp-my-inner">
		<h1>CakePHPのサンプル</h1>
<p>
これはCakePHPのサンプル画面です。
</p>

<!-- 出力フィールド -->
<br><table><tr><th>key</th><th>value</th></tr>
<tr><td>text1</td><td>テスト</td></tr>
<tr><td>text2</td><td>test</td></tr>
<tr><td>hidden1</td><td>hidden_value</td></tr>
<tr><td>select1</td><td>3</td></tr>
<tr><td>check1</td><td>1</td></tr>
<tr><td>check2</td><td>0</td></tr>
<tr><td>radio1</td><td>c</td></tr>
</table>
<br><hr><br>

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

<input name="data[TestForm][text1]" type="text" value="テスト" id="TestFormText1" /><br>
<input type="password" name="data[TestForm][text2]" value="test" id="TestFormText2" /><br>
<input type="hidden" name="data[TestForm][hidden1]" value="hidden_value" id="TestFormHidden1" /><br>
<select name="data[TestForm][select1]" id="TestFormSelect1">
<option value="">選択してください</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3" selected="selected">3</option>
</select><br><input type="hidden" name="data[TestForm][check1]" id="TestFormCheck1_" value="0" />
<input type="checkbox" name="data[TestForm][check1]" checked="checked" value="1" id="TestFormCheck1" /><br>
<input type="hidden" name="data[TestForm][check2]" id="TestFormCheck2_" value="0" />
<input type="checkbox" name="data[TestForm][check2]"  value="1" id="TestFormCheck2" /><br>
<fieldset>
<legend>ラジオ</legend>
<input type="radio" name="data[TestForm][radio1]" id="TestFormRadio1A" value="a"  />
<label for="TestFormRadio1A">a</label><input type="radio" name="data[TestForm][radio1]" id="TestFormRadio1B" value="b"  />
<label for="TestFormRadio1B">b</label><input type="radio" name="data[TestForm][radio1]" id="TestFormRadio1C" value="c" checked="checked"  />
<label for="TestFormRadio1C">c</label>
</fieldset>
<div class="submit">
<input type="submit" value="送信" />
</div>
</form>
		</div>
	</div>

	<div id="egp-my-footer">
		<div class="egp-my-inner">
		Some rights reserved by EzoGP Project.
		</div>
	</div>

</div>

</body>
</html>