用cakephp的formhelper来增加表单

一、关于这篇文章

    由于近期用cakephp开发一个boss后台,找了一下关于php方面的资料,自己添加一部分,记录下这篇文章。

二、基本的语法内容(摘录部分)

2.1  创建表单的开始和结束语句
$form->create(string $model = null, array $options = array())
$form->end( $options = NULL )

这个是一对form的开始和结尾方法,构成一个完整的form。
echo $form->create();
echo $form->end();


<form id="AddForm" method="post" action="/test/tests/add">
	<fieldset style="display:none;">
		<input type="hidden" name="_method" value="POST" />
	</fieldset>
</form>


当不带任何参数的时候,form->create生成了一个post方法的action为当前controller的add方法的form,并且生成了一个很奇怪的隐藏input,名字是_method,暂时还不知道是干啥子用的。form->end就生成了一个结尾。这显然不是我们所需要的。form->end负责着生成最后的提交按钮的说。

      所以我们最需要的形式是:
echo $form->create("",
	array(
	  "type"=>"get",
	  "id"=>"a",
	  "name"=>"b",
	  "onsubmit"=>"javascript:chk()",
	  "url"=>array(
	    'controller'=>'ControllerName',
	    'action'=>'ActionName',
	    '?'=>array(
	      "id"=>5,
	      "category"=>3,
	      "category2"=>5
	    )
	  )
	)
     );
echo $form->end("提交");


<form id="a" name="b" onsubmit="javascript:chk()" method="post" action="/test/ControllerName/ActionName?id=5&amp;amp;category=3&amp;amp;category2=5">
<fieldset style="display:none;">
<input type="hidden" name="_method" value="DELETE" />
</fieldset>
<div class="submit">
<input type="submit" value="提交" />
</div>
</form>



在上面的例子里面,type=“get”的时候,不会生成对应的<fieldset>里面的隐藏域,其他的“post、put、 delete ” 都会生成这个很奇怪的隐藏域,不知道到底是做啥子用途的。get的时候method会是get,其他的时候都是post,只不过隐藏域会有所不同。还有这个form的url生成的参数的时候,“&”会被2次转义成“&amp;amp;”。很是奇怪的说。

对于上传附件表单,里面还增加 ‘ENCTYPE’=>’multipart/form-data’ 选项。

这个form的结束语句还可以写成下面的形式,可以定制的选项就更多了。
这个form的结束语句还可以写成下面的形式,可以定制的选项就更多了。

echo $form->end(
  array(
    'label' => '提交',
    'name' => 'Whatever',
    'div' => array(
      'class' => 'good'
    )
  )
);


<div class="good">
    <input type="submit" name="Whatever" value="提交" />
  </div>
</form>


2.2、输入input

echo $form->input('birthday',
    array(
        'name'=>'birthday_name',
        'id'=>'birthday_id_overwrite',
        'label' => '生日',
        'value'=>"20090310"
    )
);


<div class="input text">
  <label for="birthday_id_overwrite">生日</label>
  <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"使之获得最大长度的属性。



echo $form->input('birthday');



<div class="input text">
    <label for="birthday">Birthday</label>
    <input name="data[birthday]" type="text" value="" id="birthday" />
</div>


输入框不含lable、div
echo $form->input('birthday', array('lable'=>false,'div'=>false));


    <input name="data[birthday]" type="text" value="" id="birthday" />


2.3、输入password


echo $form->input('password',array('value'=>'fdsa','label'=>'邪门的密码框'));

<div class="input text">
   <label for="password">邪门的密码框</label>
    <input name="data[password]" type="text" value="fdsa" id="password" />
</div>

         这个东东有够邪门的,单独运行还不行。而出现的普通的输入框, 可以选择

    1、放在form->create和end中间,并且在create中指定了第一个参数,从第二个参数中指定id或者name覆盖第一个参数都不行。是不是很邪门。

    2、或者单独运行的话,用type=>’password’来强制变成password类型,不期待他的自动识别。

注:自动识别的话,需要设置第一个参数为 ‘psword’, ‘passwd’, ‘password’ 三个中的某个值,还不一定会识别成功。hoho。真是崩溃。



echo $form->create('123',array('name'=>'456','id'=>'123'));
echo $form->input('password',array('value'=>'fdsa','label'=>'邪门的密码框'));
echo $form->end();


<form name="456" id="123" method="post" action="/test/123s/add">
    <fieldset style="display:none;">
        <input type="hidden" name="_method" value="POST" />
    </fieldset>
    <div class="input password">
        <label for="123Password">邪门的密码框</label>
        <input type="password" name="data[123][password]" value="fdsa" id="123Password" />
    </div>
</form>

2.4、输入textarea
echo $form->input('textarea');
echo $form->input('textarea',array('rows' => '5', 'cols' => '5'));
echo $form->input('textarea',array('type' =>'textarea'));
echo $form->input('textarea',array('cols' null,'rows'=>null,'type'=>'textarea'));

<div class="input text">
    <label for="textarea">Textarea</label>
    <input name="data[textarea]" type="text" value="" id="textarea" />
</div>
<div class="input text">
    <label for="textarea">Textarea</label>
    <textarea name="data[textarea]" cols="5" rows="5" id="textarea" >
    </textarea>
</div>
<div class="input textarea">
    <label for="textarea">Textarea</label>
    <textarea name="data[textarea]" cols="30" rows="6" id="textarea" ></textarea>
</div>
<div class="input textarea">
    <label for="textarea">Textarea</label>
    <textarea name="data[textarea]" cols="" rows="" id="textarea" >
</textarea>

     这个里面和password一样,只写一个参数的时候,识别不出来,出来的是普通的input。而强制制定了type=textarea后,将能正确识别,或者指定rows或者cols中的某个值,也是能识别出来的。但是我的习惯是不写rows和cols,而是通过css指定其高度宽度什么的。所以,就出现了最后的那中写法,先清空rows和cols,再指定type。hoho。到现在为止,我觉得有必要的话,需要重写个formhelper了。

2.5、上传文件框file


echo $form->input('file_upload',array('type'=>'file','label'=>false,'div'=>false));

文件上传的框框,我可不喜欢有label和div跟着,设置label和div都为false,就没有对应的输出了。真是不错的主意。其他的里面也可以用这个办法去掉默认的label和div。这个是很常用的。


<input type="file" name="data[file_upload]" value="" id="file_upload" />

2.6、下拉框select



echo $form->input('field', array('options' => array(1,2,3,4,5),'label'=>false,'div'=>'false));



<select name="data[field]" id="field">
<option value="0">1</option>
<option value="1">2</option>
<option value="2">3</option>
<option value="3">4</option>
<option value="4">5</option>
</select>


不过这种写法没有办法指定value,所以要改进一下。增加options,value=>text。


echo $form->input(
    'field',
    array(
        'options' => array(
            '5'=>'北京',
            '10'=>'唐山',
            '18'=>'上海',
            '30'=>'美国'
        ),
        'label'=>false,
        'div'=>false,
        'onchange'=>'javascript:alert(this.value)'
    )
);

<select name="data[field]" onchange="javascript:alert(this.value)" id="field">
<option value="5"> 北京</option>
<option value="10">唐山</option>
<option value="18">上海</option>
<option value="30">美国</option>
</select>

当然可以增加个选项,’multiple’=>true 或者 ‘multiple’=>’multiple’ 使之变成多选。


echo $form->input(
    'field',
    array(
        'options' => array(
            '5'=>'北京',
            '10'=>'唐山',
            '18'=>'上海',
            '30'=>'美国'
        ),
        'label'=>false,
        'div'=>false,
        'multiple'=>true
    )
);


    当没有options的时候,可以强制’type’=>’select’使之呈现为下拉框。



1.echo $form->input(
    'field',
    array(
        'type'=>'select',
        'label'=>false,
        'div'=>false
    )
);


当然还可以指定’selected’=>options中的vlaue值,使select有默认值,这个函数也很不错,不用自己写循环了。 hoho~。官方还出了个专门用于select制定默认值的参数。 ‘default’=>value ,例如下例中的’selected’=>18就可以是’default’=>18,所以貌似这个参数也是个垃圾参数。

default可以用于radio、select。但是selected不可以用于radio,但是可以用于select和 Cakephp特有的时间类型。



echo $form->input(
    'field',
    array(
        'options' => array(
            '5'=>'北京',
            '10'=>'唐山 ',
            '18'=& gt;'上海',
            '30'=>'美国'
        ),
        'selected'=>18,
        'label'=>false,
        'div'=>false
    )
);


官方对于select还有个垃圾参数选项,叫做empty。用于设置每个select的最开始的那个“请选择”的空值的option,但是完全可以通过设置options的第一个值为”=>’请选择’来达到同样的效果,并且官方提供的empty选项还会替换options中的值为空的 option,如:


echo $form->input(
    'field',
    array(
        'options' => array(
            '5'=>'北京',
            ''=>'请选择',
            '10'=>'唐山',
            '18'=>'上海',
            '30'=>'美国'
        ),
        'selected'=>18,
        'label'=>false,
        'div'=>false,
        'empty'=>'chooseone'
    ));



<select name="data[field]" id="field">
<option value="5"> 北京</option>
<option value="">chooseone</option>
<option value="10">唐山</option>
<option value="18" selected="selected">上海</option>
<option value="30">美国</option>
</select>

2.7、单选框radio

单选框radio和select的写法基本上一致,就是type=‘radio’就行了。所有属性几乎一致。



echo $form->input(
    'field',
    array(
        'options' => array(
            '5'=>'北京',
            '10'=>'唐山',
            '18'=>'上海',
            '30'=>'美国'
        ),
        'type'=>'radio',
        'default'=>10,
                  'legend'=>false,
        'div'=>false,
        'onchange'=>'javascript:alert(this.value)'
    )
);

和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进行控制了。


echo $form->input(
    'field',
    array(
        'options' => array(
            '5'=>'北京',
            '10'=>'唐山',
            '18'=>'上海',
            '30'=>'美国'
        ),
        'type'=>'select',
        'multiple'=>'checkbox',
        'default'=>array("5","18"),
        'label'=>false,
        'div'=>false
    )
);


<input type="hidden" name="data[field]" value="" />
 
<div class="checkbox">
<input type="checkbox" name="data[field][]" checked="checked" value="5" id="Field5" />
<label for="Field5" class="selected">北京</label>
</div>
 
<div class="checkbox">
<input type="checkbox" name="data[field][]" value="10" id="Field10" />
<label for="Field10">唐山</label>
</div>
 
<div class="checkbox">
<input type="checkbox" name="data[field][]" checked="checked" value="18" id="Field18" />
<label for="Field18" class="selected">上海</label></div>
 
<div class="checkbox">
<input type="checkbox" name="data[field][]" value="30" id="Field30" />
<label for="Field30">美国</label>
</div>

而且会生成个多余的hidden东东,很奇怪的说。

2.9、隐藏域hidden


echo $form->input(
    '',
    array(
        'type'=>'hidden',
        'id'=>'test_id',
        'name'=>'test_name',
        'value'=>'test_value',
        'label'=>false,
        'div'=>false
    )
);

<input type="hidden" name="test_name" id="test_id" value="test_value" />

2.10、提交按钮submit



echo $form->submit('提交',array("div"=>false));


<input type="submit" value="提交" />

图像组成的submit


echo $form->button('',array('type'=>'image','src'=>'test.jpg'));


<input type="image" value="" src="test.jpg" />

普通按钮button


echo $form->button('按钮',array('class'=>'class_name'));

<input type="button" value="按钮" class="class_name" />

你可能感兴趣的:(JavaScript,html,PHP,css,cakephp)