How to Build a Custom Form Based on the Standard Joomla Form Using ChronoForms
In the previous article I told about ChronoForms Joomla component that allows to create a custom form for your website. But sometimes it is useful to create a form that is based on the standard one though must have essential differences. This instruction will let you know of how you can use ChronoForms component to create such form.
As an example, we will create a registration page that mimics the functionality of Joomla registration page using ChronoForms. This allows you to bring added security to into the registration process on your site whilst only needed to edit one Joomla file to make yourfinal site more secure.
Create the basic form
Login to the administration area of your Joomla website. Choose Chrono Forms > Form Wizard from the Components menu:
Add fields to your form
You are now going to use the Forms Wizard to develop the various portions of your form. First, click on the Textbox and drag it into the Forms box:
Click it to edit, then in the Properties box set the Label to Name and the Validation to Required:
Click Apply in the properties box to accept these changes.
Add two more fields
In exactly the same way add two more TextBoxes.
Change the label of the first to Username with Validation Required; apply the changes.
Change the label of the second to Email address with Validation both Required and Email; apply the changes.
Add password fields
Add two password boxes. Label the first Password and the second Confirm password. Make both required and Apply the changes:
Add image verification and submission
Add the last two fields to your form – you need to be careful to drag the fields into the grey border of the Form box or they will be put in the wrong sequence. If that happens, delete the misplaced field and try again. Add a Captcha field and label it Image Verification and then a button and label it Register
Save your form
This is all you have to do in the Form Wizard area, so click on the Save Form option:
Save your form with an obvious name like Registration. Once you have saved the form in the wizard, you can’t use the wizard to edit it; you have to edit the form directly using the other tabs in the editor.
Add changes to make the form work as registration form
You should be back in the main Chrono Forms management area of the component now. If not, go to the Components menu, choose Chrono Forms and Forms Management. On the page that appears, the registration form you made should be listed. Click directly on the name of the form.
Turn the email on
First, in the section under General tab, you need to set the Email the results? To Yes via popup menu:
Enable anti-spam email verification
Under the anti-spam tab, you need to set Use Image Verification to Yes and What Type of Image to Show? To With Fonts:
Enable field validation
Under the Validation tab, set Enable Validation? to Yes and Validation Library to mootools:
Enable Joomla registration
Under the Plugins tab, make sure that Joomla Registration option is ticked:
Find the input fields ids
You now need to do some investigation for some things we are going to do later. Go to the Form Code tab and in that section click the +/- link next to Form HTML so that so you can see all the code that is making up the form at the moment. You need to check the Names for each of the fields that are being placed within your form:
Add validation for the password fields
Go back to the Validation tab. We need to enable Server Side Validation and add code that compares the two passwords to see if they are the same:
<?php
global $mainframe;
if ( JRequest::getVar(‘text_3′) != JRequest::getVar(‘text_4′) )
return ‘Sorry, your passwords do not match, please try again!';
?>
You can see that the code uses the Names of the Password and Confirm password fields. Note that there is no apostrophe (do not instead of don’t as that can cause problems).
You can now save the form as we are almost finished.
Link the form to the Registration plugin within Chrono Forms
The final part is to tell Chrono Forms that you want this form linked to a Registration plugin within Chrono Forms. Basically this is saying to Chrono Forms to treat this form a little special in relation to other forms. It’s very easy to do and ensures that the information entered by users into the form gets added into your database in the same was that all other registrations do.
Simply put a tick next to the name of your form in the Form Management area and then click on the words Joomla Registration in the Plugins column to the left of the list:
Link the fields
On the page that appears, put the Input Names in that you noted earlier. Here is an example of how the Names need to be entered to match your fields with the ones expected by the Joomla registration process.
Once you have entered the field names, click Save and you’ve got a working registration form!
Direct users away from the regular registration page
Once you have created the new registration page and have tested it to ensure it is working properly, you need to ensure that users don’t end up at the old (regular) registration page. To do this, one file needs to be altered (ensure you’ve made a backup copy of this file first).
The file can be found at: components/com_users/views/register/tmpl/default.php
You need to alter the code at the very beginning of the file, so that
<?php // no direct access
defined(‘_JEXEC’) or die(‘Restricted access’); ?>
is changed to
<?php // no direct access
defined(‘_JEXEC’) or die(‘Restricted access’);
chr
?>
For example, If you want to move the users away from http://www.yourdomain.com/index.php?option=com_user&task=register to http://www.yourdomain.com/index.php the code would be
<?php // no direct access
defined(‘_JEXEC’) or die(‘Restricted access’);
$mainframe->redirect(‘register.html’);
?>
Direct users away from the regular registration page:
not working for me….
Hello Fabio,
Could you please send us more details about your issue?
and what about joomla 1.7. what we can do?