Downloaded 225 times
![Advanced Web forms using PHP Web forms using PHP with AJAX and advanced plug-ins http://www.phpclasses.org/formsgeneration Manuel Lemos [email_address] This presentation license: Creative Commons Attribution-NoDerivs 2.5](https://image.slidesharecdn.com/forms-with-ajax-and-advanced-plugins4919/85/Forms-With-Ajax-And-Advanced-Plugins-1-320.jpg)
![Filtering the input values Load submitted input values Convert escaped values – magic quotes Filter forged values Example: MAXLENGTH , DiscardInvalidValues Format input value masks using regular expressions Example: zip code -> “ ^( [0-9]{5} )-?( [0-9]{3} )$ ” -> “ \1 - \2 ”](https://image.slidesharecdn.com/forms-with-ajax-and-advanced-plugins4919/85/Forms-With-Ajax-And-Advanced-Plugins-14-320.jpg)
![The end Thank you for your time and attention! Questions? Send a message to [email_address]](https://image.slidesharecdn.com/forms-with-ajax-and-advanced-plugins4919/85/Forms-With-Ajax-And-Advanced-Plugins-32-320.jpg)
![Advanced Web forms using PHP Web forms using PHP with AJAX and advanced plug-ins http://www.phpclasses.org/formsgeneration Manuel Lemos [email_address] This presentation license: Creative Commons Attribution-NoDerivs 2.5](https://image.slidesharecdn.com/forms-with-ajax-and-advanced-plugins4919/75/Forms-With-Ajax-And-Advanced-Plugins-1-2048.jpg)
![Filtering the input values Load submitted input values Convert escaped values – magic quotes Filter forged values Example: MAXLENGTH , DiscardInvalidValues Format input value masks using regular expressions Example: zip code -> “ ^( [0-9]{5} )-?( [0-9]{3} )$ ” -> “ \1 - \2 ”](https://image.slidesharecdn.com/forms-with-ajax-and-advanced-plugins4919/75/Forms-With-Ajax-And-Advanced-Plugins-14-2048.jpg)
![The end Thank you for your time and attention! Questions? Send a message to [email_address]](https://image.slidesharecdn.com/forms-with-ajax-and-advanced-plugins4919/75/Forms-With-Ajax-And-Advanced-Plugins-32-2048.jpg)
Uploaded byManuel Lemos
Forms With Ajax And Advanced Plugins
The document provides an overview of a PHP-based forms generation and validation class that integrates with AJAX and offers various plugins for enhanced functionality. It includes a detailed history of its development, methods for usage, validation techniques, and presentation options. Additionally, it outlines future plans for expanding the system and opportunities for community contributions.
More Related Content
Similar to Forms With Ajax And Advanced Plugins
Forms With Ajax And Advanced Plugins
- 1. Advanced Web formsusing PHP Web forms using PHP with AJAX and advanced plug-ins http://www.phpclasses.org/formsgeneration Manuel Lemos [email_address] This presentation license: Creative Commons Attribution-NoDerivs 2.5
- 2. Creative Commons LicenseDeed Attribution-No Derivs 2.5 You are free: to Share -- to copy, distribute, display, and perform the work to make commercial use of the work Under the following conditions: Attribution . You must attribute the work in the manner specified by Manuel Lemos . No Derivative Works . You may not alter, transform, or build upon this work. For any reuse or distribution, you must make clear to others the license terms of this work. Any of these conditions can be waived if you get permission from Manuel Lemos . Your fair use and other rights are in no way affected by the above. This is a human-readable summary of the Legal Code (the full license) .
- 3. Forms Generation andValidation class – What is it? A class of objects written in PHP Generates HTML to present Web forms Generates Javascript to validate before submitting the forms to the Web server Validate forms on the server side with the PHP code of the class itself Extensible using plug-in classes Open Source with a BSD like license Good reputation in the PHP Open Source world Over 44.000 distinct users downloaded it from the PHPClasses site Number 248 in Freshmeat popularity top
- 4. Class development history12/01/1999 : Class creation ../../1999 : Offer the class to other users in PHP mailing lists 05/06/1999 : User recommends the class a lot in the php-general list 18/06/1999 : Beginning of the PHPClasses site 24/06/1999 : Launch of the PHPClasses site 16/12/2002 : Plug-in to integrate with Smarty 03/04/2004 : Templates with simple PHP code within HTML 14/06/2004 : Special input controls using plug-in classes 29/12/2004 : Processing browser side events on the server side 25/06/2005 : Connected input trigger actions upon browser side events 14/03/2006 : Submission of forms using AJAX
- 5. Plug-in release history14/06/2004 : Date 29/12/2004 : CAPTCHA 25/06/2005 : Linked select 30/12/2005 : MySQL, Metabase, MDB2 linked select 14/03/2006 : AJAX submit 26/03/2006 : Layout vertical 24/05/2006 : Map location 21/06/2006 : Autocomplete 12/07/2006 : MySQL, Metabase, MDB2 autocomplete 28/07/2006 : Animation 20/12/2006 : Upload progress meter
- 6. How should itbe used? The script that processes the form also presents it. Yes No No Yes Create an object of the class Define the form inputs Load the submitted values, if any Show the form for the first time? Validate submitted input values All the inputs are valid? Process the form Output the form Output the form denoting invalid inputs
- 7. Example of usageinclude('forms.php'); $form = new forms_class; $form->AddInput(array( 'TYPE'=>'text', 'NAME'=>'nome', 'ID'=>'nome', 'LABEL'=>'<u>N</u>ame, 'ACCESSKEY'=>'N', 'ValidateAsNotEmpty'=>1, 'ValidationErrorMessage'=> 'No name was entered.' )); $form->LoadInputValues(); $processed=false; if($form->WasSubmitted()) { $error=$form->Validate($verify); if(strlen($error)) echo 'Error: ', $error; else { // Processing goes here $processed=true; } } if($processed) echo 'The form was processed!'; else { $form->StartLayoutCapture(); require('template.php'); $form->EndLayoutCapture(); $form->DisplayOutput(); }
- 8. Template sample template.php<p><?php $form->AddLabelPart(array( 'FOR'=>'name' )); ?>: <?php $form->AddInputPart('name'); ?></p>
- 9. API Divided in3 layers: Definition Presentation Processing
- 10. API: Form definitionAddInput Adds an input to the form with given parameters Connect, ConnectFormToInput Connect inputs in such way that when an event happens in the source input or the form, an action is executed in the scope of the target input Example: when a select input changes, it is emulated a click action in a submit input Configuration class variables Example: ACTION , METHOD , TARGET , etc..
- 11. API: Form presentationAddInputPart, AddLabelPart, AddDataPart Adds an input, an input label, or custom HTML to the form output StartLayoutCapture, EndLayoutCapture Automatic capture of HTML to include in the form output FetchOutput, DisplayOutput Generates HTML and Javascript of the whole form PageHead, PageLoad, PageUnload Generates HTML and Javascript that must be included in the page HEAD section or in the ONLOAD and ONUNLOAD attributes of the BODY tag
- 12. API: Form processingLoadInputValues Extract submitted input values, discards forged values, convert escaped values, format input value masks WasSubmitted Checks whether the form is being submitted for processing, or the form is being presented for the first time Validate Checks whether the input values of the whole form (or part) are valid GetInputValue, GetCheckedState, GetCheckedRadio Retrieve the input values to let the application process the form
- 13. Form input definitionsAssociative array passed to the AddInput function: Mandatory parameters: TYPE , NAME , ID Presentation parameters: CLASS , LABEL , etc. Validation parameters Input type specific parameters Example: $form->AddInput( array( 'TYPE'=>'password', 'NAME=>'password', 'ID'=>'password', 'CLASS'=>'password' 'ValidateAsNotEmpty'=>true, 'ValidationErrorMessage'=>'The password field is empty.', 'MAXLENGTH'=>10 ) );
- 14. Filtering the inputvalues Load submitted input values Convert escaped values – magic quotes Filter forged values Example: MAXLENGTH , DiscardInvalidValues Format input value masks using regular expressions Example: zip code -> “ ^( [0-9]{5} )-?( [0-9]{3} )$ ” -> “ \1 - \2 ”
- 15. Validating the inputvalues Generates Javascript for browser side validation Server side validation in PHP with the class itself Sub-forms to validate a subset of inputs depending on the submit button that was used Example: SubForm -> “cancel” Special values to skip validation Example: ValidateOptionalValue -> “” Error messages to show when input values are invalid Focus and highlighting of invalid inputs Example: InvalidCLASS , InvalidSTYLE
- 16. Predefined types ofvalidation Empty input, minimum length Input is equal or different from another input or value Integer, decimal or floating point number E-mail address, credit card number Match or does not match a regular expression Ticked an input of a group of radio or check box inputs Developer defined validation functions Special validation type implemented by plug-in classes
- 17. Form presentation usingtemplates HTML with PHP StartLayoutCapture and EndLayoutCapture to capture the current script HTML output and adds it to the form output using AddDataPart Plug-in for the Smarty template engine Pre-filter that replaces Smarty templates with the tags {input} and {label} by calls to AddDataPart , AddInputPart and AddLabelPart Automatic layout Standard form presentation defined without requiring that the developer enters HTML manually
- 18. Plug-ins Provide: Newtypes of input controls New behaviors New validation types New types of layout for groups inputs Implemented using sub-classes of a base plug-in class May generate HTML and Javascript, or nothing at all
- 19. Plug-in: Calendar dateDisplays 3 inputs to choose the year, month and day The date format is configurable Accepts any valid date between 1 and 9999 AC May restrict accepted dates within a start and end day
- 20. Plug-in: Human uservalidation using CAPTCHA Generates an image with the text to be typed The image is obfuscated to difficult guessing by robots Users can use a button to redraw unreadable images The validation text may expire after a timeout period
- 21. Plug-in: Pick amap location Get the coordinates of a location picked by the user The maps are presented using the Google Maps API The coordinates appear in text inputs The map zoom level may be adjusted in several ways
- 22. Plug-in: Automatic verticallayout Layout several inputs vertically, one per row Does not require defining HTML for the default layout The layout HTML templates are customizable Invalid inputs appear with a special mark Specific inputs may be turned invisible
- 23. Plug-in: Animation visualeffects Animates page elements using visual effects Each animation is a sequence of visual effects Several animation sequences may run in parallel Several effect types may be used: Replace or insert HTML content Show or hide a page element Fade-in or fade-out a page element Cancel running animation to synchronize effects
- 24. Plug-in: Submit aform using AJAX Submit the form without reloading the page Uses the hidden IFRAME approach, which is more powerful and portable than using XMLHttpRequest Can show server-side activity feedback Generates Javascript to execute actions in response: Replace or insert HTML content in the current page Change properties of page elements Pause for a given period Redirect the browser to another page Execute an arbitrary Javascript command
- 25. COMET: AJAX usingIFRAME Accesses the form page -> ← Sends form with Javascript and IFRAME Submits form with the IFRAME -> ← Sends HTML with Javascript to update the form page : Browser : Web Server
- 26. Plug-in: Linked selectinputs May link two or more select inputs in chain Switches options when the value of another changes Static options or retrieved from the server using AJAX Has special versions to get options from a database
- 27. Plug-in: Auto-complete textCompletes typed text using a list of words Shows menu with the words that can complete the text May get completion words from the server using AJAX Has special versions to get the words from a database
- 28. Plug-in: Upload progressmeter Sends a parallel AJAX request during form submission Uses the uploadprogress extension to monitor upload Renders a progress bar with optional upload statistics
- 29. 3 rd party plug-ins Xinha: Alessandro Bianchi (Italy) HTML editor http://www.phpclasses.org/xinha_plug_in Cal: Alessandro Bianchi (Italy) Calendar with pop-up to browse the months and years http://www.phpclasses.org/plugin_cal_class FCKEditor: Matías Montes (Argentina) HTML editor http://www.phpclasses.org/form_fckeditor Your plug-in Anybody can develop, share, or even sell your own plug-ins
- 30. Future plans Defineforms using separate XML files Take plain HTML templates for form authoring with visual editing programs like DreamWeaver Cache the definition and output of forms Drag and drop event processing plug-in Generic scaffolding plug-in: list and edit dynamic data Example: insert, list, change and delete database table records Other plug-ins you may ask
- 31. Contribution opportunities Fixand report eventual bugs Suggest new features Translate the documentation to other idioms Develop and share new plug-ins Spread the word about this project
- 32. The end Thankyou for your time and attention! Questions? Send a message to [email_address]
- 33. References Forms classpage http://www.phpclasses.org/formsgeneration Support forum http://www.phpclasses.org/discuss/package/1/ Mailing list http://groups.yahoo.com/group/forms-dev Mailing list for Portuguese speakers http://br.groups.yahoo.com/group/forms-pt