How to customize your Zend Form fields to appear in columns

I received a requirement to change the form layout on a web page. I was not using any decorators on the form so the form was coming up in default format generated by Zend Form.

This is the page which displays the form when some one clicks on Edit

Once you click on Edit the form appears like so

Zend Form default layout without decorators

I had to show the fields in 4 columns so that the layout remains consistent with what was shown to the member before clicking on the Edit link.

I opened the form file (in application/forms directory) and added the following code to the file at the bottom after all the elements had been added to the form.

$this->addDisplayGroups(array(
			'left_fields' => array(
			'elements' => array($email, $firstname, $lastname, $company, $address1, $address2),
			),
		        'right_fields' => array(
			'elements' => array($city, $state, $postcode, $country, $phonenumber),
			),
			'bottom_field' => array(
			'elements' => array($cancel, $submit),
			)
		));		

$this->setDisplayGroupDecorators(array('Description', 'FormElements', 'Fieldset'));

I used the Zend Form addDisplayGroups method to group the fields in three separate groups (left_fields, right_fields, bottom_field) so that Zend Form generates the HTML fieldset element which encloses the form elements.

After adding the above code and running the script you will find no difference except when you do a View Source of the page you will see that 3 HTML fieldsset elements have been generated. Now you can tweak your CSS to align the form elements as you want.

I added the following code in the CSS file.

form fieldset#fieldset-left_fields, form fieldset#fieldset-right_fields
{
    float: left;
    width: 50%;
    border: none;
}

Now when I ran the script I got the desired results and the form fields were formatted in the layout I wanted.

This is how the page looked after adding the above code.

Zend Form new layout using decorators

Hope the above helped!

How to display custom error message in Zend Captcha

The client recently requested to change the text of the default Zend CAPTCHA error message to just Incorrect Code when a visitor tries to submit the form without entering the CAPTCHA code in the input box beneath the image.
That was pretty easy enough as Zend provides you the option to override the default error message.

You just need to add the following line to the parameters being sent when instantiating the Zend Captcha object.

'messages' => array('badCaptcha' => 'Incorrect Code')

After applying the line and testing it we get the desired message as can be seen below

Comments?

How to verify email address using the Zend Email Validator

Zend framework provides some nice validators to validate the data input by your visitor/customer. If you want you can write your own custom validator and use it in your code. The one I would like to discuss today is the Zend Email Validator which is really wonderful in that you don’t need to write any JavaScript code to validate the email address. You just need to add the Zend Email Validator to the form element and it will take care of the rest.

Take a look at the following form element against which I have added the Zend Email Validator

$email = new Zend_Form_Element_Text('email');
$email->setLabel('Email Address')
 	->setRequired(true)
  	->addFilter('StripTags')
  	->addFilter('StringTrim')
  	->addValidator('NotEmpty')
	->addValidator(new Zend_Validate_EmailAddress(
			array('domain' => true)
		      ));

The above code will check the domain part of the email address provided by the customer.

Once the visitor tries to enter invalid email address then the system will flag the error message. Please see below

Comments?

How to allow access to authorized members in Zend using Zend_Session_Namespace

You can maintain and manage sessions and cookies in Zend framework just like you can do in normal PHP code or any other language/framework. Zend provides the Zend_Session_Namespace which allows you to create and manage sessions. Once you have created a session variable you can then use it to authorize a user’s access to any web page. You can use it by placing the code in the init() action event of the controller which you wish to restrict access to only authorized members of the website. The init() action event is executed first by the controller before any other action event. Therefore it’s the best place to put this code.

Consider the following code

public function init() {
	$uid = new Zend_Session_Namespace('uid');
	if (isset($uid->id)) {
               // Do nothing here
	}
	else {
               // Take the user to the login page
		$this->_helper->redirector('index','login');
	}			
}

The above code checks for a uid session variable. If it has been created then it means that the user has successfully logged into the system. If not then the user is taken to the login page to login into the system. You can also use an intermediary page to display any custom message to the user instead of redirecting to the login page.

Hope the above helped. Let me know how it went for you. I appreciate your comments.