Haohappy 2005-12-28
http://blog.csdn.net/Haohappy2004
Haohappy 在《 PHP & More 》第三期的 《 PEAR::HTML_QuickForm 入門 》 一文中 說過要寫 QuickForm 和 Smarty 的結(jié)合應(yīng)用,一直沒寫,今天看到 PHPE 論壇上有朋友在詢問,為自己的懶惰而慚愧?,F(xiàn)在補上,希望對大家有點幫助。 在我看來, PEAR::HTML_QuickForm 是個非常優(yōu)秀的表單類庫,大大加快了開發(fā)速度,我現(xiàn)在的大多數(shù)項目都會用到。 如果對 PEAR::HTML_QuickForm 不了解的朋友,建議先看這篇文章。
本文針對的讀者為有較豐富開發(fā)經(jīng)驗的 PHP 程序員,要求讀者
<!--[if !supportLists]--> 1. <!--[endif]--> 熟悉 PEAR 及其安裝和使用;
<!--[if !supportLists]--> 2. <!--[endif]--> 熟悉 HTML_QuickForm ;
<!--[if !supportLists]--> 3. <!--[endif]--> 理解模板的概念,熟悉 Smarty 模板引擎的使用。
在 《 PEAR::HTML_QuickForm 入門 》的 表單的美化輸出 一節(jié)中,提到了用 QuickForm 自帶的 Form 修飾方法來美化輸出。很明顯,這種方法顯得有點麻煩,而且讓程序員來美化網(wǎng)頁,有點難為我們了。 現(xiàn)在程序員和設(shè)計師的合作最常見的就是通過模板,所以如何把 QuickForm 和模板引擎相結(jié)合,這就是我們需要解決的問題。
其實
QuickForm 可以和多種模板引擎相結(jié)合,如 ITX, Sigma, Flexy, Smarty 等, 每種模板都有其優(yōu)點和缺點,目前Smarty是最通用的模板引擎,所以我們把QuickForm和Smarty的結(jié)合作為重點來研究。
首先,給大家看看我們的最后效果:
這個例子非常簡單,只有一個
Form
,
4
個
Input
,只是用來講解
QuickForm
的使用。在實際開發(fā)中,我們經(jīng)常遇到幾十個
Input
的情況。實際上,表單越復(fù)雜,就越顯出我們傳統(tǒng)的處理方式的低效,就越顯出
QuickForm
的強大。這一點,也許大家以后會體會到。
好,開始我們的
QuickForm+Smarty
之旅。
changPwd.php
<?
require_once(
"includes/config.inc.php"
);
//
構(gòu)建
Smarty
對象
$smarty
=new
Smarty_App
;
$smarty
->
assign
(
'CSSDIR'
,
'./templates/admin'
);
$smarty
->
assign
(
'title'
,
':: Haohappy Test
網(wǎng)站管理系統(tǒng)
::'
);
//
構(gòu)建登錄表單
$form
=new
HTML_QuickForm
(
'frmChgPwd'
,
'post'
);
//
增加表單元素
$form
->
addElement
(
'password'
,
'adminPwd'
,
''
,
'class=NameAndPwd'
);
$form
->
addElement
(
'password'
,
'newPwd'
,
''
,
'class=NameAndPwd'
);
$form
->
addElement
(
'password'
,
'newPwd2'
,
''
,
'class=NameAndPwd'
);
$form
->
addElement
(
'submit'
,
'btnSubmit'
,
'
修改密碼
'
,
'class=btnSubmit'
);
//
增加驗證規(guī)則
會自動生成
javascript
變量,存入
javascript
驗證函數(shù)
$form
->
addRule
(
'adminPwd'
,
'
密碼不能為空!
'
,
'required'
,
''
,
'client'
);
$form
->
addRule
(
'newPwd'
,
'
新密碼不能為空!
'
,
'required'
,
''
,
'client'
);
$form
->
addRule
(
'newPwd2'
,
'
新密碼不能為空!
'
,
'required'
,
''
,
'client'
);
$form
->
addRule
(array(
'newPwd'
,
'newPwd2'
),
"
兩次輸入的密碼不同??!
"
,
'compare'
,
''
,
'client'
);
if(
$form
->
validate
()){
//
如果表單數(shù)據(jù)正確,修改密碼
$form
->
process
(
'changePwd'
);
}
else{
//
否則顯示表單
//
建立
renderer
對象
$renderer
=&new
HTML_QuickForm_Renderer_ArraySmarty
(
$smarty
);
//buildtheHTMLfortheform
生成表單的
HTML
代碼
$form
->
accept
(
$renderer
);
//assignarraywithformdata
分配表單數(shù)據(jù)到數(shù)組中
$smarty
->
assign
(
'form_data'
,
$renderer
->
toArray
());
$smarty
->
catching
=
false
;
//
調(diào)試
//echo"<pre>";var_dump($renderer->toArray());echo"</pre>";
$smarty
->
display
(
"changePwd.tpl"
);
}
//
修改密碼
function
changePwd
(){}
?>
在代碼中,我們用
$form->addElement()
增添了
4
個表單元素,用
$form->addRule()
增加了
4
條驗證規(guī)則。怎么樣,是不是很快捷方便?
以驗證兩個密碼是否相同的驗證規(guī)則為例,如果我們自己寫驗證規(guī)則,雖然快,但是代碼就會顯得臃腫和凌亂,由
QuickForm
來負(fù)責(zé)數(shù)據(jù)驗證,開發(fā)速度大大提高,而且代碼顯得很簡潔漂亮。僅用了一行代碼:
$form
->
addRule
(array(
'newPwd'
,
'newPwd2'
),
"
兩次輸入的密碼不同!!
"
,
'compare'
,
''
,
'client'
);
關(guān)于 QuickForm 的好處,請參看 《 PEAR::HTML_QuickForm 入門 》 ,在此不再重復(fù)。
下面這行代碼就是我們將
HTML_QuickForm
與
Smarty
連接的橋梁:
$renderer
=&new
HTML_QuickForm_Renderer_ArraySmarty
(
$smarty
);
所謂 renderer ,就是用來負(fù)責(zé)顯示的,這里我們把 QuickForm 的 renderer 指定為 Smarty ,我們就可以使用強大的 Smarty 模板引擎來格式化 QuickForm 的輸出了。
其它:
changePwd
()
是這個文件的核心操作函數(shù),用來修改密碼。
$form
->
process
(
'changePwd'
);
//
這行代碼用來調(diào)用
changePwd()
//echo"<pre>";var_dump($renderer->toArray());echo"</pre>";
這一行用來調(diào)試,我們隨時可以把
$renderer
中的所有變量打印出來,看看程序是否執(zhí)行正確。
再看我們的模板,也很簡單:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> changePwd.tpl </TITLE>
<<place w:st="on">META</place> NAME="Generator" CONTENT="EditPlus">
<<place w:st="on">META</place> NAME="Author" CONTENT="Haohappy">
<<place w:st="on">META</place> NAME="Keywords" CONTENT="">
<<place w:st="on">META</place> NAME="Description" CONTENT="">
<link href="{$CSSDIR}/style.css" rel="stylesheet" type="text/css">
{if $form_data.javascript}
{$form_data.javascript}
{/if}
</HEAD>
<BODY>
<p> </p>
<p> </p>
<p> </p>
<form {$form_data.attributes} >
<table width="300"
border="0" align="center" cellpadding="3" cellspacing="3" bgcolor="#F6F6F6" style="font-size:9pt" class="AddTable">
<tr bgcolor="#FFFFFF">
<td width="47%" colspan="2"><div align="center">
修改管理員密碼
</div></tr>
<tr>
<tr>
<td width="47%"><div align="center">
現(xiàn)有管理員密碼
</div></td>
<td width="53%">{$form_data.adminPwd.html}</td>
</tr>
<tr>
<td><div align="center">
新密碼
</div></td>
<td>{$form_data.newPwd.html}</td>
</tr>
<tr>
<td><div align="center">
再次輸入新密碼
</div></td>
<td>{$form_data.newPwd2.html}</td>
</tr>
<tr>
<td colspan="2"><div align="center">
{$form_data.btnSubmit.html}
</div></td>
</tr>
</table>
</form>
</BODY>
</HTML>
這兩個簡單的文件,總共不到 100 行代碼,就完成了我們在文章開頭的效果。包含完整的表單數(shù)據(jù)驗證,處理過程。
另:使用 QuickForm ,可以很方便地實現(xiàn)顯示層和邏輯層的分離,因為處理的函數(shù)是完全獨立出來的。
例如說可以把
if(
$form
->
validate
()){
//
如果表單數(shù)據(jù)正確,修改密碼
$form
->
process
(
'changePwd'
);
}
<!--[if !supportLineBreakNewLine]-->
<!--[endif]-->
改裝成
if(
$form
->
validate
()){
switch ($post_vars['action']) {
default:
case "changPwd":
$form
->
process
(
'changePwd'
);
break;
case "Add":
$form
->
process
(
'add'
);
break;
case "Update":
$form
->
process
(
'update'
);
break;
case "Delete":
$form
->
process
(
'delete'
);
break;
}
<!--[if !supportLineBreakNewLine]-->
<!--[endif]-->
然后把 changePwd,add,update,delete 四個函數(shù)獨立到某個文件當(dāng)中。這樣就可以根據(jù)頁面提交的 action 來調(diào)用不同的操作。
這個想法相對比較簡陋一些,如果你要用更強大的功能,還可以試試 PEAR:: HTML_QuickForm_Controller 。 HTML_QuickForm_Controller 基于 PageController 設(shè)計模式 ,也就是用單個頁面來處理通過 GET 和 POST 傳遞而來的 request 和 action 。這是個非常有意思的想法,但是這種開發(fā)模式不適合于新手,因為相對比較復(fù)雜。其作者也說:
HTML_QuickForm_Controller is not intended for PHP newbies. If you don't understand what classes are, if you have no prior experience with QuickForm, if you are a fan of copy-paste programming then this package is not for you.
The package is indeed complex, but so are the problems it is trying to solve. Try to rewrite any of the enclosed multipage form examples without using such a package and you'll see what we mean.
這部份暫不討論,這需要大家對MVC有一定了解,下次有機會再另寫文章。我自己目前的開發(fā)框架就是個MVC框架,覺得很順手,顯示部份就是
更多文章、技術(shù)交流、商務(wù)合作、聯(lián)系博主
微信掃碼或搜索:z360901061

微信掃一掃加我為好友
QQ號聯(lián)系: 360901061
您的支持是博主寫作最大的動力,如果您喜歡我的文章,感覺我的文章對您有幫助,請用微信掃描下面二維碼支持博主2元、5元、10元、20元等您想捐的金額吧,狠狠點擊下面給點支持吧,站長非常感激您!手機微信長按不能支付解決辦法:請將微信支付二維碼保存到相冊,切換到微信,然后點擊微信右上角掃一掃功能,選擇支付二維碼完成支付。
【本文對您有幫助就好】元
