原文：http://newsn.net/20090515/422.html
一、关于这篇文章
这篇文章是我第一次用livewriter来写博客。原来语法高亮插件和wordpress下面的mce好像有点水土不服，总是有这样或者那样的问题，所 以就试试最新流行的livewriter来试试离线发布博客。在livewriter里面写东西和word的感觉很相似。感觉很不错。大家也可以试 试，msn的安装包里面是默认集成的这个东东。官方网址是：http://download.live.com/writer
今天我想写的内容，是用Cakephp的formhelper来增加表单。增加常用的input，textarea等等出来。不过今天的结论是使用这些helper实在是太痛苦了。不如自己手写代码，早就搞定了。
二、基本的语法内容
2.1 创建表单的开始和结束语句
1.
$form ->create(string $model = null, array $options = array ())
2.
$form -> end ( $options = NULL )
这个是一对form的开始和结尾方法，构成一个完整的form。
1.
echo $form ->create();
2.
echo $form -> end ();
1.
< form id = "AddForm" method = "post" action = "/test/tests/add" >
2.
< fieldset style = "display:none;" >
3.
< input type = "hidden" name = "_method" value = "POST" />
4.
</ fieldset >
5.
</ form >
当不带任何参数的时候，form->create生成了一个post方法的action为当前controller的add方法的form，并且生 成了一个很奇怪的隐藏input，名字是_method,暂时还不知道是干啥子用的。form->end就生成了一个结尾。这显然不是我们所需要 的。form->end负责着生成最后的提交按钮的说。
所以我们最需要的形式是：
01.
echo $form ->create( "" ,
02.
array (
03.
"type" => "get" ,
04.
"id" => "a" ,
05.
"name" => "b" ,
06.
"onsubmit" => "javascript:chk()" ,
07.
"url" => array (
08.
'controller' => 'ControllerName' ,
09.
'action' => 'ActionName' ,
10.
'?' => array (
11.
"id" =>5,
12.
"category" =>3,
13.
"category2" =>5
14.
)
15.
)
16.
)
17.
);
18.
echo $form -> end ( "提交" );
1.
< form id = "a" name = "b" onsubmit = "javascript:chk()" method = "post" action = "/test/ControllerName/ActionName?id=5&amp;category=3&amp;category2=5" >
2.
< fieldset style = "display:none;" >
3.
< input type = "hidden" name = "_method" value = "DELETE" />
4.
</ fieldset >
5.
< div class = "submit" >
6.
< input type = "submit" value = "提交" />
7.
</ div >
8.
</ form >
在上面的例子里面，type=“get”的时候，不会生成对应的<fieldset>里面的隐藏域，其他的“post、put、 delete ” 都会生成这个很奇怪的隐藏域，不知道到底是做啥子用途的。get的时候method会是get，其他的时候都是post，只不过隐藏域会有所不同。还有这 个form的url生成的参数的时候，“&”会被2次转义成“&amp;”。很是奇怪的说。
对于上传附件表单，里面还增加 ‘ENCTYPE’=>’multipart/form-data’ 选项。
这个form的结束语句还可以写成下面的形式，可以定制的选项就更多了。
01.
echo $form->end(
02.
array(
03.
'label' => '提交' ,
04.
'name' => 'Whatever' ,
05.
'div' => array(
06.
'class' => 'good'
07.
)
08.
)
09.
);
1.
< div class = "good" >
2.
< input type = "submit" name = "Whatever" value = "提交" />
3.
</ div >
4.
</ form >
2.2、输入input
1.
echo $form ->input( 'birthday' ,
2.
array (
3.
'name' => 'birthday_name' ,
4.
'id' => 'birthday_id_overwrite' ,
5.
'label' => '生日' ,
6.
'value' => "20090310"
7.
)
8.
);
1.
< div class = "input text" >
2.
< label for = "birthday_id_overwrite" >生日</ label >
3.
< input name = "birthday_name" type = "text" id = "birthday_id_overwrite" value = "20090310" /></ div >
这个里面主要的是第一个参数id，会生成input的id，而且默认的name是data[id]，会涉及到以后的取值问题哦。label就是 input前面的字了，对于非英文状态的页面很是管用，在第二个array中的id和name都是可以指定的。这个需要注意。还可以指定 maxLength="3"使之获得最大长度的属性。
1.
echo $form ->input( 'birthday' );
1.
< div class = "input text" >
2.
< label for = "birthday" >Birthday</ label >
3.
< input name = "data[birthday]" type = "text" value = "" id = "birthday" />
4.
</ div >
2.3、输入password
1.
echo $form ->input( 'password' , array ( 'value' => 'fdsa' , 'label' => '邪门的密码框' ));
1.
< div class = "input text" >
2.
< label for = "password" >邪门的密码框</ label >
3.
< input name = "data[password]" type = "text" value = "fdsa" id = "password" />
4.
</ div >
这个东东有够邪门的，单独运行还不行。而出现的普通的输入框， 可以选择
1、放在form->create和end中间，并且在create中指定了第一个参数，从第二个参数中指定id或者name覆盖第一个参数都不行。是不是很邪门。
2、或者单独运行的话，用type=>’password’来强制变成password类型，不期待他的自动识别。
注：自动识别的话，需要设置第一个参数为 ‘psword’, ‘passwd’, ‘password’ 三个中的某个值，还不一定会识别成功。hoho。真是崩溃。
1.
echo $form ->create( '123' , array ( 'name' => '456' , 'id' => '123' ));
2.
echo $form ->input( 'password' , array ( 'value' => 'fdsa' , 'label' => '邪门的密码框' ));
3.
echo $form -> end ();
01.
< form name = "456" id = "123" method = "post" action = "/test/123s/add" >
02.
< fieldset style = "display:none;" >
03.
< input type = "hidden" name = "_method" value = "POST" />
04.
</ fieldset >
05.
< div class = "input password" >
06.
< label for = "123Password" >邪门的密码框</ label >
07.
< input type = "password" name = "data[123][password]" value = "fdsa" id = "123Password" />
08.
</ div >
09.
</ form >
2.4、输入textarea
1.
echo $form ->input( 'textarea' );
2.
echo $form ->input( 'textarea' , array ( 'rows' => '5' , 'cols' => '5' ));
3.
echo $form ->input( 'textarea' , array ( 'type' => 'textarea' ));
4.
echo $form ->input( 'textarea' , array ( 'cols' =>null, 'rows' =>null, 'type' => 'textarea' ));
01.
< div class = "input text" >
02.
< label for = "textarea" >Textarea</ label >
03.
< input name = "data[textarea]" type = "text" value = "" id = "textarea" />
04.
</ div >
05.
< div class = "input text" >
06.
< label for = "textarea" >Textarea</ label >
07.
< textarea name = "data[textarea]" cols = "5" rows = "5" id = "textarea" >
08.
</ textarea >
09.
</ div >
10.
< div class = "input textarea" >
11.
< label for = "textarea" >Textarea</ label >
12.
< textarea name = "data[textarea]" cols = "30" rows = "6" id = "textarea" ></ textarea >
13.
</ div >
14.
< div class = "input textarea" >
15.
< label for = "textarea" >Textarea</ label >
16.
< textarea name = "data[textarea]" cols = "" rows = "" id = "textarea" >
17.
</ textarea >
这个里面和password一样，只写一个参数的时候，识别不出来，出来的是普通的input。而强制制定了type=textarea后，将能正确识 别，或者指定rows或者cols中的某个值，也是能识别出来的。但是我的习惯是不写rows和cols，而是通过css指定其高度宽度什么的。所以，就 出现了最后的那中写法，先清空rows和cols，再指定type。hoho。到现在为止，我觉得有必要的话，需要重写个formhelper了。
2.5、上传文件框file
1.
echo $form ->input( 'file_upload' , array ( 'type' => 'file' , 'label' =>false, 'div' =>false));
文件上传的框框，我可不喜欢有label和div跟着，设置label和div都为false ，就没有对应的输出了。真是不错的主意。其他的里面也可以用这个办法去掉默认的label和div 。这个是很常用的。
1.
<input type= "file" name= "data[file_upload]" value= "" id= "file_upload" />
2.6、下拉框select
1.
echo $form ->input( 'field' , array ( 'options' => array (1,2,3,4,5), 'label' =>false, 'div' =>'false));
1.
<select name= "data[field]" id= "field" >
2.
<option value= "0" >1</option>
3.
<option value= "1" >2</option>
4.
<option value= "2" >3</option>
5.
<option value= "3" >4</option>
6.
<option value= "4" >5</option>
7.
</select>
不过这种写法没有办法指定value，所以要改进一下。增加options，value=>text。
01.
echo $form ->input(
02.
'field' ,
03.
array (
04.
'options' => array (
05.
'5' => '北京' ,
06.
'10' => '唐山' ,
07.
'18' => '上海' ,
08.
'30' => '美国'
09.
),
10.
'label' =>false,
11.
'div' =>false,
12.
'onchange' => 'javascript:alert(this.value)'
13.
)
14.
);
1.
< select name = "data[field]" onchange = "javascript:alert(this.value)" id = "field" >
2.
< option value = "5" >北京</ option >
3.
< option value = "10" >唐山</ option >
4.
< option value = "18" >上海</ option >
5.
< option value = "30" >美国</ option >
6.
</ select >
当然可以增加个选项，’multiple’=>true 或者 ‘multiple’=>’multiple’ 使之变成多选。
01.
echo $form->input(
02.
'field' ,
03.
array(
04.
'options' => array(
05.
'5' => '北京' ,
06.
'10' => '唐山' ,
07.
'18' => '上海' ,
08.
'30' => '美国'
09.
),
10.
'label' => false ,
11.
'div' => false ,
12.
'multiple' => true
13.
)
14.
);
当没有options的时候，可以强制’type’=>’select’使之呈现为下拉框。
1.
echo $form ->input(
2.
'field' ,
3.
array (
4.
'type' => 'select' ,
5.
'label' =>false,
6.
'div' =>false
7.
)
8.
);
当然还可以指定’selected’=>options中的vlaue值，使select有默认值，这个函数也很不错，不用自己写循环了。 hoho~。官方还出了个专门用于select制定默认值的参数。 ‘default’=>value ，例如下例中的’selected’=>18就可以是’default’=>18，所以貌似这个参数也是个垃圾参数。
default可以用于radio、select。但是selected不可以用于radio，但是可以用于select和Cakephp特有的时间类型。
01.
echo $form->input(
02.
'field',
03.
array(
04.
'options' => array(
05.
'5'=>'北京',
06.
'10'=>'唐山',
07.
'18'=>'上海',
08.
'30'=>'美国'
09.
),
10.
'selected'=>18,
11.
'label'=>false,
12.
'div'=>false
13.
)
14.
);
官方对于select还有个垃圾参数选项，叫做empty。用于设置每个select的最开始的那个“请选择”的空值的option，但是完全可以 通过设置options的第一个值为”=>’请选择’来达到同样的效果，并且官方提供的empty选项还会替换options中的值为空的 option，如：
01.
echo $form ->input(
02.
'field' ,
03.
array (
04.
'options' => array (
05.
'5' => '北京' ,
06.
'' => '请选择' ,
07.
'10' => '唐山' ,
08.
'18' => '上海' ,
09.
'30' => '美国'
10.
),
11.
'selected' =>18,
12.
'label' =>false,
13.
'div' =>false,
14.
'empty' => 'chooseone'
15.
));
1.
< select name = "data[field]" id = "field" >
2.
< option value = "5" >北京</ option >
3.
< option value = "" >chooseone</ option >
4.
< option value = "10" >唐山</ option >
5.
< option value = "18" selected = "selected" >上海</ option >
6.
< option value = "30" >美国</ option >
7.
</ select >
2.7、单选框radio
单选框radio和select的写法基本上一致，就是type=‘radio’就行了。所有属性几乎一致。
01.
echo $form->input(
02.
'field' ,
03.
array(
04.
'options' => array(
05.
'5' => '北京' ,
06.
'10' => '唐山' ,
07.
'18' => '上海' ,
08.
'30' => '美国'
09.
),
10.
'type' => 'radio' ,
11.
'default' =>10,
12.
'legend' => false ,
13.
'div' => false ,
14.
'onchange' => 'javascript:alert(this.value)'
15.
)
16.
);
和select相比，radio能使用default，不能使用selected、multiple、empty。而且对于radio，label一定不要false掉，label在选择东西的时候还是很有用途的。
对于“legend”选项，当不设为false的时候会多个<fieldset><legend>Field</legend>……</field>出来，很是令人崩溃。
2.8、多选框checkbox
多选框和其他的东东很不一样，居然不是通过设置type来获得的，居然是通过设置select的multiple属性来获得的。而且最终出来的代码也不是很理想，有着多余的div，并且js事件也无法获得。所以到时候也许需要对应的css和js进行控制了。
01.
echo $form ->input(
02.
'field' ,
03.
array (
04.
'options' => array (
05.
'5' => '北京' ,
06.
'10' => '唐山' ,
07.
'18' => '上海' ,
08.
'30' => '美国'
09.
),
10.
'type' => 'select' ,
11.
'multiple' => 'checkbox' ,
12.
'default' => array ( "5" , "18" ),
13.
'label' =>false,
14.
'div' =>false
15.
)
16.
);
01.
<input type= "hidden" name= "data[field]" value= "" />
02.
03.
<div class = "checkbox" ><input type= "checkbox" name= "data[field][]" checked = "checked" value= "5" id= "Field5" /><label for = "Field5" class = "selected" >北京</label></div>
04.
05.
<div class = "checkbox" ><input type= "checkbox" name= "data[field][]" value= "10" id= "Field10" /><label for = "Field10" >唐山</label></div>
06.
07.
<div class = "checkbox" ><input type= "checkbox" name= "data[field][]" checked = "checked" value= "18" id= "Field18" /><label for = "Field18" class = "selected" >上海</label></div>
08.
09.
<div class = "checkbox" ><input type= "checkbox" name= "data[field][]" value= "30" id= "Field30" /><label for = "Field30" >美国</label>
10.
</div>
而且会生成个多余的hidden东东，很奇怪的说。
2.9、隐藏域hidden
01.
echo $form->input(
02.
'' ,
03.
array(
04.
'type' => 'hidden' ,
05.
'id' => 'test_id' ,
06.
'name' => 'test_name' ,
07.
'value' => 'test_value' ,
08.
'label' => false ,
09.
'div' => false
10.
)
11.
);
1.
<input type= "hidden" name= "test_name" id= "test_id" value= "test_value" />
2.10、提交按钮submit
1.
echo $form ->submit( '提交' , array ( "div" =>false));
1.
< input type = "submit" value = "提交" />
图像组成的submit
1.
echo $form ->button( '' , array ( 'type' => 'image' , 'src' => 'test.jpg' ));
1.
< input type = "image" value = "" src = "test.jpg" />
普通按钮button
1.
echo $form ->button( '按钮' , array ( 'class' => 'class_name' ));
1.
< input type = "button" value = "按钮" class = "class_name" />
三、其他相关东东
貌似还有，再说了。哈哈。以后再研究。
扫一扫
2617
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
