Formulare complexe in cativa pasi QuickForm & Smarty

PEAR, Smarty, ADOdb, OOP, PHP 5, XML, UML, Şabloane de proiectare, PHP-GTK.

Moderatori: coditza, Emil, Moderatori

Emil
PHPRomania Coder Professional
Mesaje: 300
Membru din: Dum Noi 16, 2003 6:33 am
Localitate: echo $REMOTE_ADDR

Formulare complexe in cativa pasi QuickForm & Smarty

Mesajde Emil » Dum Mai 09, 2004 4:52 am

De curand am fost pus in situatia de a face niste formulare imense pentru aplicatia la care lucrez. Mentionez ca toata aplicatia este bazata pe pachete PEAR si SMARTY ca template engine si clase "home made".
Aveam ceva experienta cu pachetul QuickForm folosindu-l cu rezultate bune in mai multe ipostaze.
Cateva date despre QuickForm :
- Este un pachet PEAR care creeaza formulare de orice tip si de asemenea validari de orice fel pentru input-uri. Validarile pot fi de orice fel server side / sau client side (cu ajutorul JavaScript) . Pachetul contine cateva reguli (rules) de validare uzuale (numeric ,email, regex,alfanumeric etc , le obtineti numele cu metoda HTML_QuickForm::getRegisteredRules()) sau validari proprii prin "callback",adica prin folosirea unei functii custom ce este apelata in momentul validarii unuia sau a mai multor input-uri . Toate acestea fara nici un pic de cod HTML , ba chiar output-ul este valid XHTML.

Sa luam ca exemplu un formular simplu de inregistrare cu 4 field-uri :
- username
- email
- password
- verificare parola
- butonul de Submit
- butonul de Reset

Exemplul este prezentat mai jos :

[php]
<?PHP
//fisierele incluse
require_once 'HTML/QuickForm.php';
$form = new HTML_QuickForm('numeform','post',"$PHP_SELF",'_parent','enctype="multipart/form-data"');
//adaugam primul field - username
$form->addElement('text', 'username', 'Username', array('size' => 20, 'maxlength' => 20 ,'class'=>'formElements'));
//field-ul pentru email
$form->addElement('text', 'email', 'Adresa de mail', array('size' => 20, 'maxlength' => 20 ,'class'=>'formElements'));
//field-ul pentru parola
$form->addElement('password', 'password', 'Parola', array('size' => 20, 'maxlength' => 45 ,'class'=>'formElements'));
//field-ul prntru verificarea parolei
$form->addElement('password', 'password2', 'Reintroduceti parola', array('size' => 20, 'maxlength' => 45 ,'class'=>'formElements'));
//butonul de Submit
$form->addElement('submit', null, 'Trimite informatiile','class=formButtons');
//butonul Reset
$form->addElement('reset', null, 'Reseteaza formularul' ,'class=formButtons');
//Formularul este gata , sa adaugam regulile de validare

//Field-ul username este obligatoriu - folosim tipul de validare "required"
$form->addRule('username', 'Ati introdus un username invalid', 'required','', 'server');
//Field-ul username trebuie sa aiba minim 6 caractere - folosim tipul de validare "minlength"
$form->addRule('username', 'Username trebuie sa aiba minim 6 caractere','minlength','6', 'server');
//Verificarea parolelor
$form->addRule('password', 'Nu ati introdus nici o parola', 'required','', 'server');
$form->addRule('password', 'Parola trebuie sa aiba minim 6 caractere','minlength','6', 'server');
//Compararea celor doua field-uri password si password2 folosind regula "compare"
$form->addRule(array('password','password2'), 'Parolele introduse nu se potrivesc !', 'compare','', 'server');
//Validam si email-ul ...cu regula "email"
$form->addRule('email','Nu ati introdus nici un email', 'required','', 'server');
$form->addRule('email','Emailul introdus este invalid', 'email','', 'server');


//aplicam un "filtru" asupra toturor elementelor din formular
//NOTA:se pot aplica filtre pe input-uri individuale in diferite circumstante,
//in situatia de fata avem nevoie de toate,deci ii specificam metodei
//applyFilter() parametrul special '__ALL__'

$form->applyFilter('__ALL__', 'trim' );
//validam formularul cu metoda validate()
if ($form->validate()){
//daca returneaza TRUE
echo "Formularul a fost validat cu succes";
//#TODO# -> prelucrarea datelor
} else {
//daca validarea a esuat (validate() a returnat FALSE
//afisam form-ul cu erorile aparute langa fiecare field (default cu culoarea rosie)
$form->display();
}

?>
[/php]
Ultima oară modificat Dum Mai 09, 2004 5:49 am de către Emil, modificat de 2 ori în total.


PHP Romania BLOG
It's time for me to find a new hobby. Preferably one that doesn't involve angle brackets. Or computers. Or electricity.

Emil
PHPRomania Coder Professional
Mesaje: 300
Membru din: Dum Noi 16, 2003 6:33 am
Localitate: echo $REMOTE_ADDR

Continuare.....

Mesajde Emil » Dum Mai 09, 2004 5:34 am

In exemplul de mai sus, codul functioneaza,dar daca folositi un template engine lucrurile se cam precipita ..
Singurul lucru care ati putea sa-l faceti ca sa includeti acest exemplu intr-un template e sa-l includeti simplu cu
{include_php file='exemplu_quickform.php'} in template-ul smarty, insa metoda nu e prea "ortodoxa" si pe langa asta nu mai aveti acces la customizarea/pozitionarea formularului intr-un mod mai usor (desi QuickForm este extensibil pana-n panzele albe totusi e de preferat un editor vizual pentru ergonomie in design) .
O solutie la aceasta problema vine cu acele "renderers" de care mai dispune in plus acest pachet pentru anumite tipuri de template engine-uri printre care din fericire si Smarty .
Stim foarte bine ca template-urile Smarty sunt construite din marcaje de genul {$numevariabila} care (teoretic) despart munca designerului de cea a programatorului. De ce nu ar fi asa si in cazul uneltei QuickForm ? Chiar asa,de ce nu ? :)

Sa revenim putin la codul de mai sus , sa-l modificam :
[php]
<?PHP
//fisierele incluse
require_once 'HTML/QuickForm.php';
//clasa Smarty
require_once ("smarty/libs/Smarty.class.php");
//renderer-ul de care va vorbeam
require_once 'HTML/QuickForm/Renderer/ArraySmarty.php';


$form = new HTML_QuickForm('numeform','post',"$PHP_SELF",'_parent','enctype="multipart/form-data"');
//adaugam primul field - username
$form->addElement('text', 'username', 'Username', array('size' => 20, 'maxlength' => 20 ,'class'=>'formElements'));
//field-ul pentru email
$form->addElement('text', 'email', 'Adresa de mail', array('size' => 20, 'maxlength' => 20 ,'class'=>'formElements'));
//field-ul pentru parola
$form->addElement('password', 'password', 'Parola', array('size' => 20, 'maxlength' => 45 ,'class'=>'formElements'));
//field-ul prntru verificarea parolei
$form->addElement('password', 'password2', 'Reintroduceti parola', array('size' => 20, 'maxlength' => 45 ,'class'=>'formElements'));
//butonul de Submit
$form->addElement('submit', "submit", 'Trimite informatiile','class=formButtons');
//butonul Reset
$form->addElement('reset', "reset", 'Reseteaza formularul' ,'class=formButtons');
//Formularul este gata , sa adaugam regulile de validare

//Field-ul username este obligatoriu - folosim tipul de validare "required"
$form->addRule('username', 'Ati introdus un username invalid', 'required','', 'server');
//Field-ul username trebuie sa aiba minim 6 caractere - folosim tipul de validare "minlength"
$form->addRule('username', 'Username trebuie sa aiba minim 6 caractere','minlength','6', 'server');
//Verificarea parolelor
$form->addRule('password', 'Nu ati introdus nici o parola', 'required','', 'server');
$form->addRule('password', 'Parola trebuie sa aiba minim 6 caractere','minlength','6', 'server');
//Compararea celor doua field-uri password si password2 folosind regula "compare"
$form->addRule(array('password','password2'), 'Parolele introduse nu se potrivesc !', 'compare','', 'server');
//Validam si email-ul ...cu regula "email"
$form->addRule('email','Nu ati introdus nici un email', 'required','', 'server');
$form->addRule('email','Emailul introdus este invalid', 'email','', 'server');


//aplicam un "filtru" asupra toturor elementelor din formular
//NOTA:se pot aplica filtre pe input-uri individuale in diferite circumstante,
//in situatia de fata avem nevoie de toate,deci ii specificam metodei
//applyFilter() parametrul special '__ALL__'

$form->applyFilter('__ALL__', 'trim' );
//validam formularul cu metoda validate()
if ($form->validate()){
//daca returneaza TRUE
$validat = true;
//#TODO# -> prelucrarea datelor
}
//se observa ca folosirea metodei display() nu mai este necesara
//Instantiem un nou Obiect Smarty
$t = new Smarty;
$t->compile_dir = './compiled';//directorul de "compilare" a template-urilor
$t->template_dir = './'; //directorul template-ului
$t->compile_check = 'true';
//$t->debugging = 'true'; //decomentati pentru "debugging" :)
//Instantiem si "renderer-ul" caruia ii dam ca parametru obiectul smarty $t
$renderer =& new HTML_QuickForm_Renderer_ArraySmarty($t);
//Se observa deja flexibilitatea aparuta ;)
//Ce se intampla mai jos :
//in cazul in care avem o eroare : se afiseaza Label-ul field-ului cu rosu
//in cazul in care un field este 'required' afisam langa el un * (asterisc)
$renderer->setRequiredTemplate(
'{if $error}
<font color="red">{$label}</font>
{else}
{$label}
{if $required}
<font color="red" size="1">*</font>
{/if}
{/if}'
);
//ca si mai sus,customizam afisarea erorilor aparute dupa Submit
//tot cu marcaje Smarty
//NOTA: se pot folosi template-uri externe pentru asa ceva
//si de asemenea folosirea oricarui modifier Smarty este binevenita
$renderer->setErrorTemplate(
'{if $error}
<font color="orange" size="1">{$error}</font><br />
{/if}{$html}'
);
//Folosim metoda accept() a clasei QuickForm spre folosire a unui output custom
//in cazul nostru un array
$form->accept($renderer);
//la final atribuim lui smarty array-ul rezultat
$t->assign('form', $renderer->toArray());
if(!$validat){
$t->display('quickform.html');
}else{
$t->display('succes.html');
}

?>
[/php]
PHP Romania BLOG

It's time for me to find a new hobby. Preferably one that doesn't involve angle brackets. Or computers. Or electricity.

Emil
PHPRomania Coder Professional
Mesaje: 300
Membru din: Dum Noi 16, 2003 6:33 am
Localitate: echo $REMOTE_ADDR

Mesajde Emil » Dum Mai 09, 2004 5:36 am

Mai jos aveti listing-urile celor 2 template-uri folosite :)
quickform.html
[php]
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Test Quickform -PHPRomania.net</title>
{literal}
<style type="text/css">
<!--
body,td,th {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
}
-->
</style>
{/literal}
</head>

<body>
<!---Atributele formularului-->
<form {$form.attributes}>
<table width="600" border="0" cellspacing="0" cellpadding="0">
<tr bgcolor="#99FFCC">
<td colspan="2">PHPRomania</td>
</tr>
<tr>
<td width="179">{$form.username.label}</td>
<td width="179">{$form.username.html}</td>
</tr>
<tr>
<td>{$form.email.label}</td>
<td>{$form.email.html}</td>
</tr>
<tr>
<td>{$form.password.label}</td>
<td>{$form.password.html}</td>
</tr>
<tr>
<td>{$form.password2.label}</td>
<td>{$form.password2.html}</td>
</tr>
<tr>
<td>&nbsp;</td>
<td>{$form.submit.html} {$form.reset.html}</td>
</tr>
</table>
</form>
</body>
</html>

[/php]


....si succes.html


[php]
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Test Quickform -PHPRomania.net</title>
{literal}
<style type="text/css">
<!--
body,td,th {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
}
-->
</style>
{/literal}
</head>

<body>
<table width="600" border="0" cellspacing="0" cellpadding="0">
<tr bgcolor="#99FFCC">
<td width="358">PHPRomania</td>
</tr>
<tr >
<td>Validarea a reusit , have a nice day :) </td>
</tr>
</table>
</body>
</html>
[/php]
Ultima oară modificat Dum Mai 09, 2004 5:46 am de către Emil, modificat 1 dată în total.
PHP Romania BLOG

It's time for me to find a new hobby. Preferably one that doesn't involve angle brackets. Or computers. Or electricity.

Emil
PHPRomania Coder Professional
Mesaje: 300
Membru din: Dum Noi 16, 2003 6:33 am
Localitate: echo $REMOTE_ADDR

Mesajde Emil » Dum Mai 09, 2004 5:44 am

Nota :
pentru tutorial am folosit pachetele Pear::Quickform si motorul de template-uri Smarty 2.62

Pentru a rula exemplele , PEAR trebuie instalat pe calculatorul gazda (fie el windows sau o masina Linux) iar pentru a instala pachetul Quicform rulati in linia de comanda :

Cod: Selectaţi tot

pear install HTML_QuickForm


Directorul de "compilare" trebuie sa aiba permisiuni de scriere in cazul in care rulati codul pe un sistem Linux .
Enjoy .
PHP Romania BLOG

It's time for me to find a new hobby. Preferably one that doesn't involve angle brackets. Or computers. Or electricity.

bogdanvursu
PHPRomania Supporter
Mesaje: 25
Membru din: Lun Aug 29, 2005 4:16 pm
Localitate: Iasi

Codul HTML trimis pe client e urat

Mesajde bogdanvursu » Lun Aug 29, 2005 4:28 pm

Exista vreun pachet pentru formulare tableless?
E greu de modificat Quickform-ul sa scoata HTML semantic?
<label> accesskey etc?
Codul javascript pt validare banuiesc ca la fel nu e chiar "state-of-the-art", adica nu foloseste DOM.
Se poate modifica, relativ usor.

Chiar as fi curios cat de simpla e customizarea lui Quickform

eyecon
Average Member
Mesaje: 180
Membru din: Mar Noi 05, 2002 3:35 pm

Mesajde eyecon » Dum Sep 04, 2005 1:32 pm

M-am juca 2 zile cu quickform si am reusit sa fac sa genereze formulare tableless. Am folosit numai 'default render'. Mai mult ca sigur ca se poate si folosind oricare din sistemele de sablonare suportate.

Avatar utilizator
ExcalIbvr
Senior Member
Mesaje: 1105
Membru din: Dum Mai 02, 2004 10:56 pm
Localitate: Oradea
Contact:

Mesajde ExcalIbvr » Sâm Oct 08, 2005 4:47 pm

Am inceput si eu sa ma joc cu QuickForm si Smarty si-s foarte incantat de cum functioneaza.

Intrebare:
As vrea sa aplic mysql_real_escape_string() pe toate campurile, la submit. E corect daca-i aplic filtrul urmator?
$form->applyFilter('__ALL__', 'mysql_real_escape_string' );

Avatar utilizator
vitea
Average Member
Mesaje: 65
Membru din: Mar Ian 10, 2006 5:03 pm
Localitate: Bucuresti
Contact:

Mesajde vitea » Dum Ian 15, 2006 3:26 pm

Apreciez calitatea discutii pe acest subiect. As dori sa vad cat mai multe schimburi de pareri la acest nivel pe PHPRomania. La obiect, profesional.

As avea insa o intrebare:

Care este impactul folosirii template-lor asupra performantei?
Eu m-am ferit pana acum sa le folosesc din cauza temerilor legate de impactul negativ asupra vitezei de executie a scripturilor.
Sunt fondate temerile mele sau se bazeaza doar pe niste supozitii gresite?

beeuser
Senior Member
Mesaje: 390
Membru din: Joi Mai 20, 2004 10:32 am
Contact:

Mesajde beeuser » Dum Ian 15, 2006 4:54 pm

Parere:

Mai rapid decat codul PHP, n-au cum sa mearga templateurile. PHP este un template system, si nu cred ca e nevoie de un alt markup pentru a creea templateuri. Recomand www.phpsavant.com

Edit: http://www.phppatterns.com/docs/design/ ... te_engines

Avatar utilizator
vitea
Average Member
Mesaje: 65
Membru din: Mar Ian 10, 2006 5:03 pm
Localitate: Bucuresti
Contact:

Mesajde vitea » Dum Ian 15, 2006 5:14 pm

beeuser, multumesc pentru raspunsul tau.

Am mers direct la a doua adresa. Am reusit sa citesc vreo 3 paragrafe pana acum. Foarte interesant!!!

REGO
PHPRomania Supporter
Mesaje: 9
Membru din: Joi Noi 09, 2006 10:30 pm
Localitate: Cluj - Napoca

Mesajde REGO » Joi Noi 09, 2006 10:58 pm

cu putin din alt subiect dar ...
am vazut ca ai comentate tagurile pentru css
sunt aprox nou .... in lucrul cu smarty si nu inteleg de ce nu merg aceste taguri ... ce trebuie facut?

Avatar utilizator
idevelop
New Member
Mesaje: 1
Membru din: Sâm Feb 10, 2007 2:07 pm

Mesajde idevelop » Sâm Feb 10, 2007 3:02 pm



imi cer scuze ca redeschid un topic mort deja de un an, dar am banuit ca, subiectul fiind sticky, mi se iarta.

vreau doar sa spun ca linkul de mai sus prezinta un mare nimic! l-am citit: 3 sferturi critica smarty, iar in ultimul sfert ne abureste cu phpHTMLLib., xslt si asp. pai scuza-ma, o avea smarty-ul problemele lui, dar nu poti sa te numesti web developer daca incerci sa scoti in fata cod ca asta:

[php]$style = html_style();
$style->add( "span.foo { font-size: 1em; font-weight: bolder;}" );
$style->add( "td { padding-left: 5px; text-align: center;}" );
$style->add( "table {border: 2px solid #999999;}" );
$style->add( "th {background-color: #eeeeee; ".
"border-bottom: 2px solid #999999;}" );
$style->add( "caption { font-size: 14pt; font-weight: bold;}" );
$page->add_head_content( $style );

$page->add( html_a($_SERVER["PHP_SELF"]."?debug=1", "Show Debug Source"),
html_br(2) );

$data_table = html_table("500", 0, 0);
[/php]

autorul ignora total proiectele la care e nevoie de mai mult de un om pentru dezvoltare. daca (in mod logic) designerul imi face layoutul, html-istul il html-izeaza, iar programatorul scrie codul, nu vreau sa ma gandesc cum se imbina munca celor doi din urma folosind codul de mai sus...

shahzadmasih
New Member
Mesaje: 1
Membru din: Mar Mar 20, 2007 3:16 pm
Localitate: UK
Contact:

Mesajde shahzadmasih » Mar Mar 20, 2007 4:34 pm

Hi, This post is very informative, however I would like some specific information. If someone can help me then please send me a private message. Best Regards,

dark_0n3
New Member
Mesaje: 2
Membru din: Vin Oct 19, 2007 3:33 pm

client-side validation

Mesajde dark_0n3 » Vin Oct 19, 2007 3:50 pm

Intrebarea mea este se poate faca utilizand smarty si html_quickform validarea pe client?...pt ca eu am incercat si intai imi face submit la server si apoi imi spune ce nereguli sunt la campurile mele... desi am dat la addRule 'client' in loc de 'server'

Daca cineva are vreo solutie va rog sa-mi ziceti... am folosit si DHTML_quickform care face validarea pe client frumos fara acel popup dar tot nu merge cu smarty... face tot submit la server...

Mersi astept un raspuns

johnutz
Senior Member
Mesaje: 956
Membru din: Mar Iul 20, 2004 9:23 am
Localitate: Între scaun şi tastatură

Mesajde johnutz » Sâm Oct 20, 2007 12:49 am

Vezi ca aici arata care e structura array-ului. Deci rezolvarea ar fi:

Cod: Selectaţi tot

{$form.javascript}
<form {$form.attributes}>
....
asta e de cand eram tanar :P


Înapoi la “PHP Avansat”

Cine este conectat

Utilizatori ce ce navighează pe acest forum: Niciun utilizator înregistrat și 37 vizitatori