Joomla
Joomla Tutorials
Custom Joomla Forms
|
|
| Monday, 03 March 2008 | ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Implementing Custom Joomla FormsOne hot topic on the Joomla Forums has always been implementing custom Joomla forms . Forms allow you to quickly and easily get information from your users. Joomla makes use of a number of forms to implement certain functionality, however it is not easy to implement Joomla forms . The following tutorial explains how to create your own Joomla forms pages. Implement your formThe first step when implementing a form, is creating the form itself. This seems like a pretty obvious step, however to do this in Joomla, you need to create a new article. Once you create the article, you need to create to insert the form code into the HTML. Well this is easier said than done. Each time you go into HTML mode of the WYSIWYG editor, enter the form code, and the article is saved, the form code is lost! The problem is that the editors strip the form code. Therefore, to create the form , you need to disable the WYSIWYG editor, and choose the No Editor option. This is done via Site > User Manager, click on Administrator (or the backend user you are using) and choose No Editor in the Editor options. Step 1 - Creating the Form - Subscribe to Newsletter Example
<table width="400" border="0" cellpadding="3" cellspacing="0"> <tr> <td colspan="2">Fields marked with an asterisk (<span class="fieldRequired">*</span>) are required. </td> </tr> <tr> <td colspan="2" height="10"></td> </tr> <tr> <td align="right">E-mail<span class="fieldRequired">*</span>: </td> <td> <input name="email" type="text" size="40" class="formField" /> </td> </tr> <tr> <td align="right">First name<span class="fieldRequired">*</span>: </td> <td><input name="firstname" type="text" size="40" class="formField" /></td> </tr> <tr> <td align="right">Last name<span class="fieldRequired">*</span>: </td> <td><input name="lastname" type="text" size="40" class="formField" /></td> </tr> <tr> <td colspan="2" height="10"></td> </tr> <tr> <td colspan="2"> <table width="100%" border="0" align="center" cellpadding="0" cellspacing="0"> <tr> <td width="251" align="right"> <input type="submit" name="subscribe"/></td> <td align="right"> </td> </tr> </table></td> </tr> </table> </form> The form above simply asks for an email address, a name and a firstname. Step 2 - Processing the Subscription FormThe second crucial step is processing the form. To do this, we will make use of a plugin which allows us to execute arbitrary PHP code. The plugin is the Jumi plugin. Install and enable this plugin. Once the plugin has been enabled, create a 2nd article. This article will include a php file which will process the subscription form. The article should contain the following code: {jumi [forms/subscribe.php]} You now need to create the PHP file which will process the form. Create a directory named forms in the root of your Joomla installation, and create the following code in subscribe.php file in the forms directory. (Remember to create an empty index.html file in the directory to avoid snoops). Also make sure you have the if( ! defined( '_VALID_MOS' ) && ! defined( '_JEXEC' ) ) defined, or you will be exposed to hack attacks. <?phpif( ! defined( '_VALID_MOS' ) && ! defined( '_JEXEC' ) ) { die( 'Direct Access is not allowed.' ); } else { $email=$_POST['email']; $firstname=$_POST['firstname']; $lastname=$_POST['lastname']; $to=" This e-mail address is being protected from spam bots, you need JavaScript enabled to view it "; $message="A Subscription Form has been submitted.\n\n$firstname $lastname just filled in the website Subscription form.\n"; $message.="First Name: $firstname\n"; $message.="Last Name: $lastname\n"; $message.="Email: $email\n"; if(mail($to,"Subscription Form",$message,"From: $email\n")) { echo "Thank you for submitting a Subscription form."; } else { echo "There was a problem sending the mail. Please check that you filled in the form correctly, or submit the information via the Contact Us page. Thank you."; } } ?> So what have we got here? This PHP code reads the inputs from the form code in Step 1, and sends an email to the email address specified in the to variable with the information collected. If the mail is successful, it outputs a success and thanks message to the user, otherwise, it outputs and error message. Step 3 - Joining the Subscription to the ProcessingOk, we we've written the form , and the processing code. Now how do we pass control from the form to the processing page? We need to find the address of the processing page. This can be done by creating a temporary menu item link to the article we have just created. This will then provide us with the menu item link which will be something similar to the following: index.php?option=com_content&view=article&id=10&Itemid=11 You now need to insert this code into the action part of the original form you have written. So you need to change <form action="#" method="post" >
to
This code will submit the form to the processing page you have created, the articles executes the PHP, and you get an email notifying you that you have a new subscriber! Hope this tutorial helps! You can tweak the tutorial to create your own forms, just change the forms and add the relevant input processing to the PHP file and you'll be good to go. Problems - Form SpammingUnfortunately, in this day and age, form spamming is all the rage. The above might subject your website to form spamming. To ensure that spammers are not using your site for sending out spam, you'll need to implement the recommendations of the following article: Preventing spam when using PHP's mail function. Or as always I'd recommend taking the easy way out. The easy way out - Joomla Forms Component
The Joomla forms component, is definetely the best forms component around. Instead of working through all the stuff mentioned above manually, just design your form through the backend interface, publish to a page and start receiving form submissions. Especially when you have a large number of forms , this component will be priceless.
Powered by !JoomlaComment 3.26
3.26 Copyright (C) 2008 Compojoom.com / Copyright (C) 2007 Alain Georgette / Copyright (C) 2006 Frantisek Hliva. All rights reserved." |
||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
| Last Updated ( Thursday, 03 July 2008 ) | ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||