用PEAR中的QuickForm实现了一个用户注册的界面,具体的操作数据库没有写。可能是我还不太熟练吧,没发现它的优点,反而不如JS,HTML直接编写来得迅速。也许它的好处就是可以控制很多吧(不是指外观)。下面的例子就实现了
用户名,EMAIL地址的格式检查,证件号码等等的检查,当然这些用JS都可以轻松完成的,大家见仁见智吧。
下面是最终效果图:
下面是PHP代码
<?php
/**
* QuickForm手工篇
*
* QuickForm手工输入之熟练篇
* 用QuickForm完成一个用户注册页面(包括信息的审查功能)
* @author jxyuhua at gmail.com
*/
require_once('HTML/QuickForm.php' );
echo('<link rel="stylesheet" href="css.css" />' );
$quickForm = new HTML_QuickForm('registerFrm' );
$country = array('1' => '中国' ,
'2' => '日本' ,
'3' => '美国' ,
'4' => '英国' ,
'0' => '其它' );
$city = array('1' => '北京' ,
'2' => '广东' ,
'3' => '江西' ,
'0' => '其它' );
$industry = array('1' => '学生' ,
'2' => '科研机构' ,
'3' => 'IT产业' ,
'0' => '其它' );
$from = array('1' => '网吧' ,
'2' => '单位' ,
'3' => '家里' ,
'0' => '其它' );
$quickForm->setDefaults(array('idtype' => 1 ,
'secret' => 1 ));
$quickForm->addElement('header', null, '新用户注册' );
$quickForm->addElement('text', 'name', '用户登录呢称:', array('size' => 20, 'maxlength' => 20 ));
$quickForm->addElement('password', 'pass', '密码:', array('size' => 20, 'maxlength' => 20 ));
$quickForm->addElement('password', 'repass', '重复输入密码:', array('size' => 20, 'maxlength' => 20 ));
$quickForm->addElement('text', 'email', 'EMAIL地址:', array('size' => 20, 'maxlength' => 50 ));
$quickForm->addElement('text', 'passquestion', '密码提示问题:', array('size' => 50, 'maxlength' => 50 ));
$quickForm->addElement('text', 'passanswer', '密码提示答案:', array('size' => 50, 'maxlength' => 50 ));
$quickForm->addElement('text', 'alias', '用户中文呢称:', array('size' => 30, 'maxlength' => 50 ));
$quickForm->addElement('textarea', 'description', '个人描述信息:', array('rows' => 3, 'cols' => 50, 'class' => 'textBox' ));
$radio[] = &$quickForm->createElement('radio', null, null, '以下信息对不外公开', '1' );
$radio[] = &$quickForm->createElement('radio', null, null, '以下信息对外公开', '0' );
$quickForm->addGroup($radio, 'secret' );
//?如何设置默认选中为身份证?
//中转的办法,设默认值
$quickForm->addElement('text', 'idnuber', '证件号码:', array('size' => 30, 'maxlength' => 30 ));
$radio2[] = $quickForm->createElement('radio', 'idtype', null, '身份证', null, array('value' => 1, 'checked' => 'true' ));
$radio2[] = $quickForm->createElement('radio', 'idtype', null, '其它证件', null, array('value' => 2 ));
$quickForm->addGroup($radio2 );
$quickForm->addElement('text', 'realname', '真实姓名:', array('size' => 20, 'maxlength' => 30 ));
$quickForm->addElement('select', 'gender', '性别:', array('male' => '男', 'female' => '女' ));
$quickForm->addElement('date', 'born', '出生于:', array('format' => 'Y 年m 月d', 'minYear' => 1940, 'maxYear' => 1995 ));
$quickForm->addElement('select', 'country', '所在国家:', $country );
$quickForm->addElement('select', 'city', '省(市):', $city );
$quickForm->addElement('text', 'town', '市(县):', array('size' => 20, 'maxlength' => 20 ));
$quickForm->addElement('text', 'address', '联系地址:', array('size' => 50, 'maxlength' => 50 ));
$quickForm->addElement('text', 'zipcode', '邮政编码:', array('size' => 20, 'maxlength' => 20 ));
$quickForm->addElement('text', 'phone', '联系电话:', array('size' => 20, 'maxlength' => 20 ));
$quickForm->addElement('text', 'company', '所在单位:', array('size' => 30, 'maxlength' => 30 ));
$quickForm->addElement('text', 'department', '所在部门:', array('size' => 20, 'maxlength' => 20 ));
$quickForm->addElement('select', 'industry', '所在行业:', $industry );
$quickForm->addElement('select', 'source', '主要在哪里<br />访问我们的网站:', $from );
$quickForm->addElement('text', 'webpage', '个人主页:', array('size' => 50, 'maxlength' => 50 ));
$quickForm->addElement('submit', null, '注册用户' );
//设定表单的规则
$quickForm->applyFilter('name', 'trim' );
$quickForm->addRule('name', '用户登录昵称必须填写!!', 'required' );
$quickForm->addRule('pass', '密码不能为空', 'required' );
$quickForm->addRule('email', '电子邮件EMAIL不能为空', 'required' );
$quickForm->addRule('passquestion', '请填写密码提示问题', 'required' );
$quickForm->addRule('passanswer', '请填写密码提示答案', 'required' );
$quickForm->addRule('idnuber', '请填写证件号码', 'required' );
$quickForm->addRule('realname', '请填写真实姓名', 'required' );
$quickForm->addRule('gender', '性别不能为空', 'required' );
$quickForm->addRule('born', '出生日期不能为空', 'required' );
$quickForm->addRule('country', '国家不能为空', 'required' );
$quickForm->addRule('city', '城市不能为空', 'required' );
$quickForm->addRule('address', '请填写你的联系地址', 'required' );
$quickForm->addRule('name', '用户登录呢称最少为5个字符', 'minlength', 5 );
$quickForm->addRule('pass', '密码太简单,不能少于5位', 'minlength', 5 );
$quickForm->addRule(array('pass', 'repass'), '两次的密码不一致', 'compare' );
$quickForm->addRule('email', '请输入正确的EMAIL地址(user@domain)', 'email' );
$quickForm->addRule('idnuber', '证件号码不能少于5位', 'minlength', 5 );
$quickForm->addRule('idnuber', '证件号码只能是英文字母或数字', 'alphanumeric' );
$quickForm->registerRule('keyword', 'function', 'checkUser' );
$quickForm->addRule('name', '用户名已经存在,请重新选择', 'keyword' );
//change style
$headerTemplate = <<< HTML
<tr>
<td style="white-space: nowrap; background-color: #CCCCCC;" align="center" valign="top" colspan="2"><b>{header} </b></td>
</tr>
HTML;
$formTemplate = <<< HTML
<form{attributes} >
<table border="0" cellspacing="1" cellpadding="0" class="table1" align="center">
{content}
</table>
</form>
HTML;
$elementTemplate = <<< HTML
<tr>
<td align="right" valign="top" class="td7"><!-- BEGIN required --><span style="color: #ff0000">*</span><!-- END required -->{label} </td>
<td valign="top" align="left" class="td8"><!-- BEGIN error --><span style="color: #ff0000">{error}</span><br /><!-- END error --> {element} </td>
</tr>
HTML;
$render = & $quickForm->defaultRenderer ();
$render->setHeaderTemplate($headerTemplate );
$render->setFormTemplate($formTemplate );
$render->setElementTemplate($elementTemplate );
if($quickForm->validate ()) {
$quickForm->process('exportValues' );
} else {
$quickForm->display ();
}
function exportValues($data ) {
echo('<pre>' );
print_r($data );
echo('</pre>' );
}
function checkUser($elementName, $elementValue ) {
$keywords = array('admin', 'administrator', 'webmaster', 'supervisor' );
if(in_array($elementValue, $keywords )) {
Return false ;
} else {
Return true ;
}
}
?>
CSS文件:
TD {FONT-SIZE: 9pt; FONT-FAMILY: Arial;line-height:150%;COLOR: #333333;}
.table1 {
background: #FFFFFF;
}
.td7{
background: #FFD04F;
}
.td8{
background: #EFEFCF;
}
.td9{
background: #D9D98E;
}
.textBox {
border: 1px solid #989C67;
background-color: #FFFFFF;
scrollbar-face-color: #DEE3E7;
scrollbar-highlight-color: #FFFFFF;
scrollbar-shadow-color: #DEE3E7;
scrollbar-3dlight-color: #D1D7DC;
scrollbar-arrow-color: #006699;
scrollbar-track-color: #EFEFEF;
scrollbar-darkshadow-color: #98AAB1;
}
用户名,EMAIL地址的格式检查,证件号码等等的检查,当然这些用JS都可以轻松完成的,大家见仁见智吧。
下面是最终效果图:
下面是PHP代码
<?php
/**
* QuickForm手工篇
*
* QuickForm手工输入之熟练篇
* 用QuickForm完成一个用户注册页面(包括信息的审查功能)
* @author jxyuhua at gmail.com
*/
require_once('HTML/QuickForm.php' );
echo('<link rel="stylesheet" href="css.css" />' );
$quickForm = new HTML_QuickForm('registerFrm' );
$country = array('1' => '中国' ,
'2' => '日本' ,
'3' => '美国' ,
'4' => '英国' ,
'0' => '其它' );
$city = array('1' => '北京' ,
'2' => '广东' ,
'3' => '江西' ,
'0' => '其它' );
$industry = array('1' => '学生' ,
'2' => '科研机构' ,
'3' => 'IT产业' ,
'0' => '其它' );
$from = array('1' => '网吧' ,
'2' => '单位' ,
'3' => '家里' ,
'0' => '其它' );
$quickForm->setDefaults(array('idtype' => 1 ,
'secret' => 1 ));
$quickForm->addElement('header', null, '新用户注册' );
$quickForm->addElement('text', 'name', '用户登录呢称:', array('size' => 20, 'maxlength' => 20 ));
$quickForm->addElement('password', 'pass', '密码:', array('size' => 20, 'maxlength' => 20 ));
$quickForm->addElement('password', 'repass', '重复输入密码:', array('size' => 20, 'maxlength' => 20 ));
$quickForm->addElement('text', 'email', 'EMAIL地址:', array('size' => 20, 'maxlength' => 50 ));
$quickForm->addElement('text', 'passquestion', '密码提示问题:', array('size' => 50, 'maxlength' => 50 ));
$quickForm->addElement('text', 'passanswer', '密码提示答案:', array('size' => 50, 'maxlength' => 50 ));
$quickForm->addElement('text', 'alias', '用户中文呢称:', array('size' => 30, 'maxlength' => 50 ));
$quickForm->addElement('textarea', 'description', '个人描述信息:', array('rows' => 3, 'cols' => 50, 'class' => 'textBox' ));
$radio[] = &$quickForm->createElement('radio', null, null, '以下信息对不外公开', '1' );
$radio[] = &$quickForm->createElement('radio', null, null, '以下信息对外公开', '0' );
$quickForm->addGroup($radio, 'secret' );
//?如何设置默认选中为身份证?
//中转的办法,设默认值
$quickForm->addElement('text', 'idnuber', '证件号码:', array('size' => 30, 'maxlength' => 30 ));
$radio2[] = $quickForm->createElement('radio', 'idtype', null, '身份证', null, array('value' => 1, 'checked' => 'true' ));
$radio2[] = $quickForm->createElement('radio', 'idtype', null, '其它证件', null, array('value' => 2 ));
$quickForm->addGroup($radio2 );
$quickForm->addElement('text', 'realname', '真实姓名:', array('size' => 20, 'maxlength' => 30 ));
$quickForm->addElement('select', 'gender', '性别:', array('male' => '男', 'female' => '女' ));
$quickForm->addElement('date', 'born', '出生于:', array('format' => 'Y 年m 月d', 'minYear' => 1940, 'maxYear' => 1995 ));
$quickForm->addElement('select', 'country', '所在国家:', $country );
$quickForm->addElement('select', 'city', '省(市):', $city );
$quickForm->addElement('text', 'town', '市(县):', array('size' => 20, 'maxlength' => 20 ));
$quickForm->addElement('text', 'address', '联系地址:', array('size' => 50, 'maxlength' => 50 ));
$quickForm->addElement('text', 'zipcode', '邮政编码:', array('size' => 20, 'maxlength' => 20 ));
$quickForm->addElement('text', 'phone', '联系电话:', array('size' => 20, 'maxlength' => 20 ));
$quickForm->addElement('text', 'company', '所在单位:', array('size' => 30, 'maxlength' => 30 ));
$quickForm->addElement('text', 'department', '所在部门:', array('size' => 20, 'maxlength' => 20 ));
$quickForm->addElement('select', 'industry', '所在行业:', $industry );
$quickForm->addElement('select', 'source', '主要在哪里<br />访问我们的网站:', $from );
$quickForm->addElement('text', 'webpage', '个人主页:', array('size' => 50, 'maxlength' => 50 ));
$quickForm->addElement('submit', null, '注册用户' );
//设定表单的规则
$quickForm->applyFilter('name', 'trim' );
$quickForm->addRule('name', '用户登录昵称必须填写!!', 'required' );
$quickForm->addRule('pass', '密码不能为空', 'required' );
$quickForm->addRule('email', '电子邮件EMAIL不能为空', 'required' );
$quickForm->addRule('passquestion', '请填写密码提示问题', 'required' );
$quickForm->addRule('passanswer', '请填写密码提示答案', 'required' );
$quickForm->addRule('idnuber', '请填写证件号码', 'required' );
$quickForm->addRule('realname', '请填写真实姓名', 'required' );
$quickForm->addRule('gender', '性别不能为空', 'required' );
$quickForm->addRule('born', '出生日期不能为空', 'required' );
$quickForm->addRule('country', '国家不能为空', 'required' );
$quickForm->addRule('city', '城市不能为空', 'required' );
$quickForm->addRule('address', '请填写你的联系地址', 'required' );
$quickForm->addRule('name', '用户登录呢称最少为5个字符', 'minlength', 5 );
$quickForm->addRule('pass', '密码太简单,不能少于5位', 'minlength', 5 );
$quickForm->addRule(array('pass', 'repass'), '两次的密码不一致', 'compare' );
$quickForm->addRule('email', '请输入正确的EMAIL地址(user@domain)', 'email' );
$quickForm->addRule('idnuber', '证件号码不能少于5位', 'minlength', 5 );
$quickForm->addRule('idnuber', '证件号码只能是英文字母或数字', 'alphanumeric' );
$quickForm->registerRule('keyword', 'function', 'checkUser' );
$quickForm->addRule('name', '用户名已经存在,请重新选择', 'keyword' );
//change style
$headerTemplate = <<< HTML
<tr>
<td style="white-space: nowrap; background-color: #CCCCCC;" align="center" valign="top" colspan="2"><b>{header} </b></td>
</tr>
HTML;
$formTemplate = <<< HTML
<form{attributes} >
<table border="0" cellspacing="1" cellpadding="0" class="table1" align="center">
{content}
</table>
</form>
HTML;
$elementTemplate = <<< HTML
<tr>
<td align="right" valign="top" class="td7"><!-- BEGIN required --><span style="color: #ff0000">*</span><!-- END required -->{label} </td>
<td valign="top" align="left" class="td8"><!-- BEGIN error --><span style="color: #ff0000">{error}</span><br /><!-- END error --> {element} </td>
</tr>
HTML;
$render = & $quickForm->defaultRenderer ();
$render->setHeaderTemplate($headerTemplate );
$render->setFormTemplate($formTemplate );
$render->setElementTemplate($elementTemplate );
if($quickForm->validate ()) {
$quickForm->process('exportValues' );
} else {
$quickForm->display ();
}
function exportValues($data ) {
echo('<pre>' );
print_r($data );
echo('</pre>' );
}
function checkUser($elementName, $elementValue ) {
$keywords = array('admin', 'administrator', 'webmaster', 'supervisor' );
if(in_array($elementValue, $keywords )) {
Return false ;
} else {
Return true ;
}
}
?>
CSS文件:
TD {FONT-SIZE: 9pt; FONT-FAMILY: Arial;line-height:150%;COLOR: #333333;}
.table1 {
background: #FFFFFF;
}
.td7{
background: #FFD04F;
}
.td8{
background: #EFEFCF;
}
.td9{
background: #D9D98E;
}
.textBox {
border: 1px solid #989C67;
background-color: #FFFFFF;
scrollbar-face-color: #DEE3E7;
scrollbar-highlight-color: #FFFFFF;
scrollbar-shadow-color: #DEE3E7;
scrollbar-3dlight-color: #D1D7DC;
scrollbar-arrow-color: #006699;
scrollbar-track-color: #EFEFEF;
scrollbar-darkshadow-color: #98AAB1;
}