首先,先创建名称为CI_04的带有CI框架源代码的工程,删除默认的控制器和视图,修改配置文件,这些都在之前的课程里面讲过,如果不会,请看前几课。我们这节课要做的仍然是一个计算器,但是我们通过使用表单辅助函数来构建我们的视图,而控制器和模型,仍然使用第三课的代码。前面提到,要想使用辅助函数,首先要载入辅助函数,为了代码的整洁性,我们在控制器中进行载入动作,在Calculate控制器的构造函数中,添加这样一行代码:
$this->load->helper(‘form’);
然后,就可以在视图中,调用我们的表单辅助函数,来完成我们的工作了。我们这里需要创建一个和第三课一样的表单,接下来,来看一下我们的视图代码。我们需要创建一个表单,并为其添加一些属性,代码可以这样写:
echo form_open(‘/calculate/count’, array(‘calss’=>’myform’, ‘id’=>’myform’));
在form_open这个函数中,第一次参数是必须的,他表示表单要提交的地址,也就是我们平时写表单的时候的action属性的值,第二个参数是可选参数,他是一个数组,通过键值对的形式,可以设置表单的一些其他属性,同时,在最前面的那个echo关键字是不能少的,如果少了,这个表单将显示不出来!现在访问一下这个页面并查看网页源代码,你会发现,你所写的PHP代码已经被CI框架翻译成了HTML代码,上面这段代码其实就等同于:
<form action=”http://localhost/CI_04/calculate/count” method=”post” accept-charset=”utf-8″ calss=”myform” id=”myform”></form>
还是很方便的吧!继续写吧,接下来,我们还需要三个输入框,一个下拉列表,一个按钮,具体代码如下:
// 创建输入框
echo form_input(array(‘name’=>’num1’, ‘id’=>’num1’));
// 创建下拉列表
values = array(‘add’ => ‘+’, ‘sub’=>’-‘, ‘mul’=>’x’, ‘div’=>’÷’);
echo form_dropdown(‘operate’,values, ‘add’, ‘id=”operate” class=”operate”‘);
// 创建输入框
echo form_input(array(‘name’=>’num2’, ‘id’=>’num2’));
echo “=”;
// 创建输入框
echo form_input(array(‘name’=>’result’, ‘id’=>’result’, ‘disabled’=>’disabled’));
// 创建提交按钮
echo form_submit(‘mysubmit’, ‘计算’, ‘id=”submit”‘);
这里需要提一下,form_input函数是用来产生输入框的,他所有的属性,都可以放在一个数组里面一起传入;form_dropdown函数是用来创建下拉列表的,等同于<select >标签,他的第一和第二个参数是必填的,第一个参数是select的name属性,第二个参数是数据源,也是一个键值对形式的数组,数组里面的每一个键值对,最后都会被解析为一个<option>标签,键为value属性,值为显示在页面上的内容,第三和第四个参数都是可选参数,第三个参数用来指定默认选择哪个option,第四个属性是一个字符串,可以书写select标签的其他属性;form_submit函数可以创建submit按钮,同样,前两个参数是必填的,分别对应name属性和value属性,第三个参数也是字符串,可以输入其他属性的内容,这样就构成了一个表单。哦!对了,为了规范起见,我们还需要最后一步,那就是关闭表单:
echo form_close();
这样,一个表单就创建好了,现在你可以浏览一下页面,同时,用调试工具看看页面的源代码,你会很轻松的就能找到他们的对应关系,当然,表单辅助函数还有很多内容,但用法都是一样的,大家可以自己去尝试,这里不做过多讲解。通过表单辅助函数创建的表单,和自己用html代码创建的表单是完全一样的,在这里,你也可以通过上节课的ajax代码操作这个表单,完成完全一样的功能和效果,大家可以自己试试。至于其他辅助函数,用法也是大同小异,只要你看懂了上面的内容,在API的帮助下,完全可以轻松的使用其他的系统所提供辅助函数。
讲了表单辅助函数,接下来要来看看一个与之息息相关的类库,那就是表单验证类,在开始讲之前先要和大家说一下,根据楼主自己的项目经验,表单验证类在实际项目中用到的很少,更多的是用表单辅助函数配合以ajax的方式,但是为了课程的需要,我在这里仍然以表单验证类进行讲解,其他的类库使用方法和该类是一样的。
在使用表单验证类之前,首先要加载它,所以我们需要在Calculate控制器的构造函数中,添加这样一行代码:
$this->load->library(‘form_validation’);
接下来,我们需要设置一下我们的验证规则,告诉表单验证类应该如何验证我们在表单中的输入,在这里,我们的验证规则比较简单,对于两个文本框而言,只要输入的是数字即可,对于中间的操作符而言,只要有输入即可(虽然在页面上看起来他是一定会有输入的,但是为了安全,我们还是需要为其设置验证规则),具体代码应该写在接收表单数据的Calculate控制器的count()方法里,我们先来设置比较简单的操作符的验证规则:
$this->form_validation->set_rules(‘operate’, ‘操作符’, ‘required’);
我们通过调用表单验证类的set_rules()方法来设置验证规则,这个方法的第一个参数是所要验证的表单域的名字,因为在之前用表单辅助函数创建表单时,我们给操作符下拉列表的名字就是operate,所以填在这里,第二个参数是会出现在错误提示中的信息,也就是表单域的别名,这里你可以随便起,第三个参数是验证规则,这里的required表示不能为空。
那么,对于两个操作数而言,就要做到既不能为空,同时又必须是数字了,这该怎么写呢?这里就用到了级联规则,具体代码如下:
$this->form_validation->set_rules(‘num1’, ‘操作数1’, ‘required|numeric’);
$this->form_validation->set_rules(‘num2’, ‘操作数2’, ‘required|numeric’);
可以看出来,设置级联规则和之前的唯一不同就是第三个参数,通过按位或运算符“|”,可以将不同的规则设置在一起。至于这些规则应该怎样写,叫什么名字,在CI框架的帮助手册中已经提到了,大家可以自己去看一下。
现在,考虑另外一个问题,用户有可能会在输入的时候,在数字的前面或者后面输入空格,如果是这样的话,直接用来计算就会出错,没错,这里可以使用trim()函数来去除空格,不过表单验证类已经提供了这些,不需要你自己来做,可以通过预处理数据来实现,而预处理的方式,其实就是设置验证规则的方式,具体写法如下:
$this->form_validation->set_rules(‘num1’, ‘操作数1’, ‘trim|required|numeric’);
$this->form_validation->set_rules(‘num2’, ‘操作数2’, ‘trim|required|numeric’);
然后,我们就可以启用我们上面设置的验证规则,检测用户提交的数据是否符合要求,如果符合规则,则进行计算,具体写法如下:
if (this->form_validation->run() == TRUE) {
// 如果能够通过验证规则,则进行计算result = this->calculate_model->count(num1, num2,op);
}else {
// 不能通过验证规则,无法进行计算,跳会原页面,让用户重新填写数据
$this->load->view(‘calculate_view’);
}
在这里我们会遇到一个问题,那就是如果输入的数据没有通过验证呢?CI的表单验证类还是做的很不错的,它提供了一个“重新填充表单”和“设置错误信息”的功能,接下来我们看一下怎样使用这两个功能。
首先说“重新填充表单”的功能,如果说用户不小心填错了一位,点击提交之后,验证失败,页面跳转回去之后,之前所填写的数据都没有了,这样的用户体验是非常糟糕的,如果我们可以在跳转回去的同时,将用户填写过的数据也能填充回到原来的位置上,用户只需要根据提示信息修改对应的内容,这样对于用户来说是一种比较友好的方式,如果要想实现这样的效果,我们需要用到CI框架提供的一个辅助函数:
set_value(‘field name’)
通过这个函数,我们可以实现上面所说的功能,这个函数需要在view里面使用,前面讲表单辅助函数的时候提过,函数的时候,可以为每个表单项设置默认值,我们就是通过这个机制,来实现重新填充表单的,具体写法如下:
<?php
// 创建表单
echo form_open(‘/calculate/count’, array(‘calss’=>’myform’, ‘id’=>’myform’));
// 创建输入框
echo form_input(array(‘name’=>’num1’, ‘id’=>’num1’, ‘value’=>set_value(‘num1’)));
// 创建下拉列表
values = array(‘add’ => ‘+’, ‘sub’=>’-‘, ‘mul’=>’x’, ‘div’=>’÷’);
echo form_dropdown(‘operate’,values, set_value(‘operate’), ‘id=”operate” class=”operate”‘);
// 创建输入框
echo form_input(array(‘name’=>’num2’, ‘id’=>’num2’, ‘value’=>set_value(‘num2’)));
echo “=”;
// 创建输入框
echo form_input(array(‘name’=>’result’, ‘id’=>’result’, ‘disabled’=>’disabled’));
// 创建提交按钮
echo form_submit(‘mysubmit’, ‘计算’, ‘id=”submit”‘);
// 关闭表单
echo form_close();
?>
现在我们可以访问一下http://localhost/CI_04/,然后故意填写一些非法的数据看一下,你会发现提交之后,页面马上会跳转回来,但是你在表单中填写的数据仍然还在。接下来我们要说一下“设置错误信息”这个功能,表单验证类的主要功能是验证用户通过表单提交的数据是否合法,我们现在所写的代码,虽然已经实现了这个功能,但是并没有提示用户提交的数据到底哪里不合法了,这样的效果也是非常不友好的,所以我们不仅要验证输入,还要在输入不合法的时候提示用户。设置错误信息主要用的函数是:
$this->form_validation->set_message(‘rule’, ‘Error Message’);
和
form_error(‘ field name’);
两个函数,这两个函数一个用在controller里,一个用在view里。在这里要说明一下,其实CI本身是提供了错误信息的,但是CI的错误信息默认是英文的,如果你认为CI的错误信息可以满足你的功能需求,也可以仅在view的对应位置使用第二个函数即可。
现在说一下这两个函数怎么使用,首先说第一个函数,第一个函数的第一个参数是验证规则的名字,例如:required、matches等等,第二个参数是当不符合该验证规则时,所要显示的错误信息,第二个参数用在view里,其参数是表单项的name,这样才好区分到底是哪个数据不符合验证规则,现在就来具体实践一下,首先要在controller里设置错误信息,这个错误信息一般写在设置验证规则的代码之后,具体写法如下:
$this->form_validation->set_message(‘required’, ‘%s不能为空’);
$this->form_validation->set_message(‘numeric’, ‘%s必须为数字’);
上面第二个参数里面包含了一个%s,这是一个占位符,这样写的话,CI会自动用表单域中设置的别名来填充这个占位符,在view端显示的时候,就可以清楚的看到到底是哪个表单域出了问题。
然后来看在view端的代码,由于我的布局限制,所以我将所有的错误信息统一显示在表单的上面,在具体项目中,可以根据自己的页面布局,来决定错误信息显示的具体位置,具体写法如下:
<?php
echo form_error(‘num1’).”<br />”;
echo form_error(‘operate’).”<br />”;
echo form_error(‘num2’).”<br />”;
?>
至此,表单验证的主要内容就已经讲完了,而且我们目前所写的代码,也能够完成大多数情况下的表单验证和数据回填的功能,但是还请大家思考一个问题,在上一节中,我们是通过ajax方式将计算结果填在表单页面的,那这节课我们的计算结果如何显示呢?既然通过前三节课的讲解我们已经将显示结果的页面和填写数据的页面合并在一起了,那么我个人认为还是不要再单独增加一个界面用来显示结果了,那下面我们就来解决这个问题。
在之前的课程中,我们讲过可以通过controller给view传参,那么同理,我们可以将计算结果传回给view,然后显示在对应的表单域中,这里我们唯一需要注意的一点就是,在第一次打开界面的时候,并不会有结果,所以我们需要在view端检测一下,如果有结果,那么我们就显示,如果没有结果,我们就不显示。现在就来看看具体代码怎么写,先看controller端:
if (this->form_validation->run() == TRUE) {
// 如果能够通过验证规则,则进行计算result = this->calculate_model->count(num1, num2,op);
// 将计算结果传给view
this->load->view(‘calculate_view’, array(‘result’=>result));
}else {
// 不能通过验证规则,无法进行计算,跳会原页面,让用户重新填写数据
$this->load->view(‘calculate_view’);
}
注意看,只是在计算之后,重新加载calculate_view视图并将结果传递给它,然后再来看view端的代码,其实view端改动很小,只需在创建显示结果的那个表单域的时候检测一下有没有结果被传入就OK了,如果有,则设置一下该表单域的默认值,具体写法如下:
// 创建输入框
if (isset(result)){
echo form_input(array(‘name’=>’result’, ‘id’=>’result’, ‘value’=>result, ‘disabled’=>’disabled’));
}else {
echo form_input(array(‘name’=>’result’, ‘id’=>’result’, ‘disabled’=>’disabled’));
}
至于isset这个函数,是最基本的PHP函数,我在这里不做任何介绍,因为这个教程最开始的时候我就说过,如果要想看懂这个教程需要有PHP基础知识。
到这里,咱们今天的课程就快结束了,但是还请大家思考一下这面的代码,咱们上面缩写的这段代码,原理其实和form_error()和set_value()这两个CI提供的辅助函数的原理一样,所以在以后的学习中,大家应该学会细心观察,融会贯通,不能仅仅学会怎样用别人提供的API,还要思考和研究被人的思想和方法。
总结:这节课通过CI框架中两个和表单有关的类介绍了在CI框架中如何使用其提供的辅助函数和类库,通过这节课的学习,可以融会贯通,举一反三的学习和使用CI框架所提供的其他辅助函数和类库。在本节课的学习中,用到了一个功能强大的表单验证类,这节课所介绍的只是这个类中最重要和最常用的几个方法,但是该类不仅仅能实现这些功能,如果大家有兴趣,建议大家再去研究一下表单验证类的“翻译表单域名字”和“将一系列验证规则保存到一个配置文件”等功能,相信会有更多的启发。
通过这节课的学习,还想和大家分享一个观点,那就是其实在真正的项目开发中,实现功能都是非常简单也是最基本的要求,其实一个项目用于编写代码的大部分时间和精力都是用在了提高性能和用户体验方面,所以大家要注意,在学习的过程中,要多多注意和思考一下这方面的内容,怎样才能使自己的程序用起来更加流畅、更加舒服,总得来说就是一句话,要想做出一个大家都认可的软件,一定要不断的提高软件的UX(用户体验)!!!
第四课源代码下载地址:
http://pan.baidu.com/s/1i33m6NV
这一篇有没有把表单辅助代码和ajax结合起来的代码呀,自己敲的出错了
没有进行结合主要是因为在实际项目中,我们几乎不用表单辅助函数,而是直接由前端人员写好html代码及js代码,这里主要是为了说明CI的辅助函数的用法,才进行讲解的
哦哦,好的,谢谢啦
感谢分享 祝您开心快乐每一天! http://www.xevip.cn
留言表示看到这里了
很棒的入门教程,看完5篇,基本能开发了。 再结合官方的中文文档,进一步完善了解就可以了。感谢博主