Zend Form Tutorial

65,879 views

Published on

A mini tutorial about using Zend_Form and Zend_Config_Xml

Published in: Technology
5 Comments
14 Likes
Statistics
Notes
  • Njce! Thanks for sharing.
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • Hi! Great technics! But how to configure custom validator messages in this xml file?
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • Thanks for the tutorial, you are a star,

    what are the correct syntax for multicheckbox and radio buttons.

    many thanks
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • Oh that's great idea -> generate form's from xml,
    Thank you for your tutorial
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • In slide 6 I said it was for Zend Framework 1.5 and higher, this means that you need to verify (Zend/Version.php) if you're using the right version.

    If this is the case, walk through my list of questions here:
    - is the location of your Zend Framework library set in the include path ?
    - Have you set a 'require_once 'Zend/From.php' or you have it autoloaded ?
    - Are you working on multiple servers (for load balancing) ?

    Try to answer these questions to see if something is missing. If you still can't find a solution to it, contact me using the e-mail mentioned on slide 2.

    Cheers,

    Michelangelo
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
No Downloads
Views
Total views
65,879
On SlideShare
0
From Embeds
0
Number of Embeds
1,352
Actions
Shares
0
Downloads
884
Comments
5
Likes
14
Embeds 0
No embeds

No notes for slide

Zend Form Tutorial

  1. 1. Zend_Form tutorial by Michelangelo van Dam
  2. 2. Who is Michelangelo van Dam ? <ul><li>Freelance PHP consultant with over 7 years of enterprise level PHP development experience. </li></ul><ul><li>Started using Zend Framework in 2007 and contributes to this framework for Zend_Ldap. </li></ul><ul><li>web: http://www.in2it.be </li></ul><ul><li>blog: http://dragonbe.blogspot.com </li></ul><ul><li>e-mail: dragonbe [at] google mail </li></ul>
  3. 3. Zend_Form <ul><li>Zend_Form simplifies form creation and handling in your web application. It accomplishes the following goals: </li></ul><ul><li>Element input filtering and validation </li></ul><ul><li>Element ordering </li></ul><ul><li>Element and Form rendering, including escaping </li></ul><ul><li>Element and form grouping </li></ul><ul><li>Element and form-level configuration </li></ul>
  4. 4. Zend_Form (continued) <ul><li>It heavily leverages other Zend Framework components to accomplish its goals, including Zend_Config, Zend_Validate, Zend_Filter, Zend_Loader_PluginLoader, and optionally Zend_View. </li></ul><ul><li>More info can be found at http://framework.zend.com/manual/en/zend.form.html </li></ul>
  5. 5. Directory structure <ul><li>application_root/ </li></ul><ul><ul><li>application/ </li></ul></ul><ul><ul><ul><li>config/ -> this is where you put the configuration files </li></ul></ul></ul><ul><ul><ul><ul><li>userform.xml </li></ul></ul></ul></ul><ul><ul><ul><li>controllers/ -> this is where you put your controllers </li></ul></ul></ul><ul><ul><ul><ul><li>UserController.php </li></ul></ul></ul></ul><ul><ul><ul><li>views/ -> this is where you put your view templates </li></ul></ul></ul><ul><ul><ul><ul><li>user/ </li></ul></ul></ul></ul><ul><ul><ul><ul><ul><li>login.phtml, register.phtml, resetpassword.phtml </li></ul></ul></ul></ul></ul><ul><ul><li>web/ </li></ul></ul><ul><ul><ul><li>index.php -> your bootstrap file </li></ul></ul></ul><ul><ul><li>library/ </li></ul></ul><ul><ul><ul><li>Zend -> This is where you put Zend Framework </li></ul></ul></ul>
  6. 6. Requirements <ul><li>Zend Framework 1.5 ( http://framework.zend.com ) </li></ul><ul><li>an editor (vi) or IDE (Zend Studio Neon) </li></ul><ul><li>a (huge) cup of coffee </li></ul><ul><li>knowledge of XML or INI structures </li></ul><ul><li>a site already using Zend Framework MVC </li></ul>
  7. 7. Example description <ul><li>We're going to build the following forms: </li></ul><ul><ul><li>User registration form </li></ul></ul><ul><ul><li>User login form </li></ul></ul><ul><ul><li>Password retrieval form </li></ul></ul>
  8. 8. userform.xml – global structure <ul><li><? xml version = &quot;1.0&quot; encoding = &quot;UTF-8&quot; ?> </li></ul><ul><li>< forms > </li></ul><ul><ul><li>< localhost > </li></ul></ul><ul><ul><ul><li>< user > </li></ul></ul></ul><ul><ul><ul><ul><li><!-- our registration form --> </li></ul></ul></ul></ul><ul><ul><ul><ul><li><register> </li></ul></ul></ul></ul><ul><ul><ul><ul><li></register> </li></ul></ul></ul></ul><ul><ul><ul><ul><li><!-- our login form --> </li></ul></ul></ul></ul><ul><ul><ul><ul><li>< login > </li></ul></ul></ul></ul><ul><ul><ul><ul><li></login> </li></ul></ul></ul></ul><ul><ul><ul><ul><li><!-- for to request a password reset --> </li></ul></ul></ul></ul><ul><ul><ul><ul><li><resetpassword> </li></ul></ul></ul></ul><ul><ul><ul><ul><li></resetpassword> </li></ul></ul></ul></ul><ul><ul><ul><li></user> </li></ul></ul></ul><ul><ul><li></localhost> </li></ul></ul><ul><li></forms> </li></ul>
  9. 9. Registration form <ul><li>Full name: the user's full name </li></ul><ul><li>E-mail address: the user's e-mail address </li></ul><ul><li>Desired username: the user's username </li></ul><ul><li>Password: a password for the account </li></ul><ul><li>Password check: retype the password </li></ul>
  10. 10. userform.xml – registration form 1 <ul><li>< register > </li></ul><ul><ul><li>< action > /app/web/register </ action > </li></ul></ul><ul><ul><li>< method > post </ method > </li></ul></ul><ul><ul><li>< name > registerForm </ name > </li></ul></ul><ul><ul><li>< elements > </li></ul></ul><ul><ul><ul><li>< fullname > </li></ul></ul></ul><ul><ul><ul><ul><li>< type > text </ type > </li></ul></ul></ul></ul><ul><ul><ul><ul><li>< options > </li></ul></ul></ul></ul><ul><ul><ul><ul><ul><li>< label > Full name: </ label > </li></ul></ul></ul></ul></ul><ul><ul><ul><ul><li></options> </li></ul></ul></ul></ul><ul><ul><ul><li></fullname> </li></ul></ul></ul><ul><li><email> </li></ul><ul><ul><ul><ul><li><type> text </type> </li></ul></ul></ul></ul><ul><ul><ul><ul><li><options> </li></ul></ul></ul></ul><ul><ul><ul><ul><ul><li><label> E-mail address: </label> </li></ul></ul></ul></ul></ul><ul><ul><ul><ul><li></options> </li></ul></ul></ul></ul><ul><ul><ul><li></email> </li></ul></ul></ul><ul><ul><ul><li><username> </li></ul></ul></ul><ul><li><type> text </type> </li></ul><ul><ul><ul><ul><li><options> </li></ul></ul></ul></ul><ul><ul><ul><ul><ul><li><label> Username: </label> </li></ul></ul></ul></ul></ul><ul><ul><ul><ul><li></options> </li></ul></ul></ul></ul><ul><ul><ul><li></username> </li></ul></ul></ul><ul><ul><ul><li><password> </li></ul></ul></ul><ul><ul><ul><ul><li><type> password </type> </li></ul></ul></ul></ul><ul><ul><ul><ul><li><options> </li></ul></ul></ul></ul><ul><ul><ul><ul><ul><li><label> Password: </label> </li></ul></ul></ul></ul></ul><ul><ul><ul><ul><li></options> </li></ul></ul></ul></ul><ul><ul><ul><li></password> </li></ul></ul></ul><ul><ul><ul><li><passwordcheck> </li></ul></ul></ul><ul><ul><ul><ul><li><type> password </type> </li></ul></ul></ul></ul><ul><ul><ul><ul><li><options> </li></ul></ul></ul></ul><ul><ul><ul><ul><ul><li><label> Retype password: </label> </li></ul></ul></ul></ul></ul><ul><ul><ul><ul><li></options> </li></ul></ul></ul></ul><ul><ul><ul><li></passwordcheck> </li></ul></ul></ul><ul><ul><ul><li>... </li></ul></ul></ul>
  11. 11. userform.xml – registration form 2 <ul><li>... </li></ul><ul><li><submit> </li></ul><ul><ul><ul><ul><li><type> submit </type> </li></ul></ul></ul></ul><ul><ul><ul><ul><li><options> </li></ul></ul></ul></ul><ul><ul><ul><ul><ul><li><label> Register </label> </li></ul></ul></ul></ul></ul><ul><ul><ul><ul><ul><li><class> button </class> </li></ul></ul></ul></ul></ul><ul><ul><ul><ul><li></options> </li></ul></ul></ul></ul><ul><li></submit> </li></ul><ul><ul><li></elements> </li></ul></ul><ul><li></register> </li></ul>
  12. 12. Login form <ul><li>Username: the user's username </li></ul><ul><li>Password: a password for the account </li></ul>
  13. 13. userform.xml – login form 1 <ul><li>< login > </li></ul><ul><ul><li>< action > /app/web/auth </ action > </li></ul></ul><ul><ul><li>< method > post </ method > </li></ul></ul><ul><ul><li>< name > login Form </ name > </li></ul></ul><ul><ul><li>< elements > </li></ul></ul><ul><ul><ul><li><username> </li></ul></ul></ul><ul><li><type> text </type> </li></ul><ul><ul><ul><ul><li><options> </li></ul></ul></ul></ul><ul><ul><ul><ul><ul><li><label> Username: </label> </li></ul></ul></ul></ul></ul><ul><ul><ul><ul><li></options> </li></ul></ul></ul></ul><ul><ul><ul><li></username> </li></ul></ul></ul><ul><ul><ul><li><password> </li></ul></ul></ul><ul><ul><ul><ul><li><type> password </type> </li></ul></ul></ul></ul><ul><ul><ul><ul><li><options> </li></ul></ul></ul></ul><ul><ul><ul><ul><ul><li><label> Password: </label> </li></ul></ul></ul></ul></ul><ul><ul><ul><ul><li></options> </li></ul></ul></ul></ul><ul><ul><ul><li></password> </li></ul></ul></ul><ul><ul><ul><li>< submit > </li></ul></ul></ul><ul><ul><ul><ul><li><type> submit </type> </li></ul></ul></ul></ul><ul><ul><ul><ul><li><options> </li></ul></ul></ul></ul><ul><ul><ul><ul><ul><li><label> Login </label> </li></ul></ul></ul></ul></ul><ul><ul><ul><ul><ul><li><class> button </class> </li></ul></ul></ul></ul></ul><ul><ul><ul><ul><li></options> </li></ul></ul></ul></ul><ul><ul><ul><li></ submit > </li></ul></ul></ul><ul><ul><li></ elements > </li></ul></ul><ul><li></login> </li></ul>
  14. 14. Resetpassword form <ul><li>E-mail address: the user's e-mail address </li></ul>
  15. 15. userform.xml – reset pwd form 1 <ul><li>< resetpassword > </li></ul><ul><ul><li>< action > /app/web/resetpassword </ action > </li></ul></ul><ul><ul><li>< method > post </ method > </li></ul></ul><ul><ul><li>< name > resetpwd Form </ name > </li></ul></ul><ul><ul><li>< elements > </li></ul></ul><ul><ul><ul><li><email> </li></ul></ul></ul><ul><li><type> text </type> </li></ul><ul><ul><ul><ul><li><options> </li></ul></ul></ul></ul><ul><ul><ul><ul><ul><li><label> E-mail address: </label> </li></ul></ul></ul></ul></ul><ul><ul><ul><ul><li></options> </li></ul></ul></ul></ul><ul><ul><ul><li></email> </li></ul></ul></ul><ul><ul><ul><li><submit> </li></ul></ul></ul><ul><ul><ul><ul><li><type> submit </type> </li></ul></ul></ul></ul><ul><ul><ul><ul><li><options> </li></ul></ul></ul></ul><ul><ul><ul><ul><ul><li><label> Reset password </label> </li></ul></ul></ul></ul></ul><ul><ul><ul><ul><ul><li><class> button </class> </li></ul></ul></ul></ul></ul><ul><ul><ul><ul><li></options> </li></ul></ul></ul></ul><ul><ul><ul><li></submit> </li></ul></ul></ul><ul><ul><li></elements> </li></ul></ul><ul><li></resetpassword> </li></ul>
  16. 16. UserController - getForm <ul><li>We create a method getForm </li></ul><ul><li>public function getForm( $myForm ) </li></ul><ul><li>{ </li></ul><ul><ul><li>$config = new Zend_Config_Xml( '../app/config/forms.xml' , 'localhost' ); </li></ul></ul><ul><ul><li>$form = new Zend_Form( $config ->user-> $myForm ); </li></ul></ul><ul><ul><li>return $form ; </li></ul></ul><ul><li>} </li></ul>
  17. 17. UserController - registerAction <ul><li>We create a method registerAction </li></ul><ul><li>public function registerAction() </li></ul><ul><li>{ </li></ul><ul><ul><li>$this ->view->form = $this ->getForm( 'register' ); </li></ul></ul><ul><li>} </li></ul><ul><li>And we put in the view script (register.phtml): </li></ul><ul><li><?php echo $this ->form; ?> </li></ul>
  18. 18. UserController - loginAction <ul><li>We create a method loginAction </li></ul><ul><li>public function loginAction() </li></ul><ul><li>{ </li></ul><ul><ul><li>$this ->view->form = $this ->getForm( 'login' ); </li></ul></ul><ul><li>} </li></ul><ul><li>And we put in the view script (login.phtml): </li></ul><ul><li><?php echo $this ->form; ?> </li></ul>
  19. 19. UserController - resetpassworAction <ul><li>We create a method resetpasswordAction </li></ul><ul><li>public function resetpasswordAction() </li></ul><ul><li>{ </li></ul><ul><ul><li>$this ->view->form = $this ->getForm( 'resetpassword' ); </li></ul></ul><ul><li>} </li></ul><ul><li>And we put in the view script (resetpassword.phtml): </li></ul><ul><li><?php echo $this ->form; ?> </li></ul>
  20. 20. Rendered register page
  21. 21. Rendered login page
  22. 22. Rendered reset password page
  23. 23. Source code of login page <ul><li>< form name = &quot;loginForm&quot; id = &quot;loginForm&quot; enctype = &quot;application/x-www-form-urlencoded&quot; action = &quot;/app/web/auth&quot; method = &quot;post&quot; > </li></ul><ul><li>< dl class = &quot;zend_form&quot; > </li></ul><ul><li>< dt >< label for = &quot;username&quot; class = &quot;optional&quot; >Username:</ label ></ dt > </li></ul><ul><li>< dd >< input type = &quot;text&quot; name = &quot;username&quot; id = &quot;username&quot; value = &quot;&quot; ></ dd > </li></ul><ul><li>< dt >< label for = &quot;password&quot; class = &quot;optional&quot; >Password:</ label ></ dt > </li></ul><ul><li>< dd >< input type = &quot;password&quot; name = &quot;password&quot; id = &quot;password&quot; value = &quot;&quot; ></ dd > </li></ul><ul><li>< dt ></ dt > </li></ul><ul><li>< dd >< input type = &quot;submit&quot; name = &quot;submit&quot; id = &quot;submit&quot; value = &quot;Login&quot; class = &quot;button&quot; ></ dd > </li></ul><ul><li></ dl > </li></ul><ul><li></ form > </li></ul><ul><li>automated generation using </li></ul><ul><li>Zend_Form </li></ul><ul><li>Zend_Config_Xml </li></ul>
  24. 24. Validation and Filtering <ul><li>Of course we need to validate input ! </li></ul><ul><li>And we filter the input ! </li></ul><ul><li>This is done easily in our configuration file </li></ul>
  25. 25. userform.xml – login enhancement
  26. 26. New source code of login page <ul><li>< form name = &quot;loginForm&quot; id = &quot;loginForm&quot; enctype = &quot;application/x-www-form-urlencoded&quot; action = &quot;/app/web/auth&quot; method = &quot;post&quot; > </li></ul><ul><li>< dl class = &quot;zend_form&quot; > </li></ul><ul><li>< dt >< label for = &quot;username&quot; class = &quot;required&quot; >Username:</ label ></ dt > </li></ul><ul><li>< dd >< input type = &quot;text&quot; name = &quot;username&quot; id = &quot;username&quot; value = &quot;&quot; ></ dd > </li></ul><ul><li>< dt >< label for = &quot;password&quot; class = &quot;required&quot; >Password:</ label ></ dt > </li></ul><ul><li>< dd >< input type = &quot;password&quot; name = &quot;password&quot; id = &quot;password&quot; value = &quot;&quot; ></ dd > </li></ul><ul><li>< dt ></ dt > </li></ul><ul><li>< dd >< input type = &quot;submit&quot; name = &quot;submit&quot; id = &quot;submit&quot; value = &quot;Login&quot; class = &quot;button&quot; ></ dd > </li></ul><ul><li></ dl > </li></ul><ul><li></ form > </li></ul><ul><li>automated generation using </li></ul><ul><li>Zend_Form </li></ul><ul><li>Zend_Config_Xml </li></ul>
  27. 27. Validation and Filtering details <ul><li>All the validation and filtering options can be found at http://framework.zend.com </li></ul><ul><li>Zend_Validate </li></ul><ul><li>Zend_Filter </li></ul><ul><li>Of course you can implement your own filters and validators. </li></ul>
  28. 28. More information <ul><li>More information can be found at the Zend Framework website http://framework.zend.com </li></ul><ul><li>The example files can be downloaded at http://www.in2it.be/files/zend_form_example.zip </li></ul>
  29. 29. Thank you Questions ?

×