How to display form error messages above each specific form element?

toymachiner62 · October 2011

I want to display any form error messages directly above the form element that is receiving the error rather than displaying all the errors at the top of the form. What is the best approach to do this? I was looking at the Validator class for getting the errors, but i'm not sure how I would implement that.

admin · October 2011

You could try using the $this->validator->get_error('my_field') to retrieve error messages for the field?

toymachiner62 · October 2011

I tried that, but I must not be doing it correctly. I did like this


$fields['name'] = array('label' => 'Name', 'required' => TRUE, 'class' => 'input left');
$this->validator->get_error('name');

but that didn't give me anything.

admin · October 2011

The required attribute just says whether to display the asterisk but doesn't actually do the validation. To do the validation, you'll need to do something like the following in the post processing area of your form (assuming you are just using the plain old validation object):
$this->validator->add_rule('name', 'required', 'Please enter in a name', $_POST['name']);

You then will need to run validate:
$valid = $this->validator->validate($_POST);

The contact controller example that comes with FUEL is a good place to look as well.

toymachiner62 · October 2011

I have been building off of the contact controller in the example actually.

In the documentation, it doesn't have any parameters in the validate() function. Is it necessary to use $_POST in the validate function?

Here's how i'm using the controller and it's just putting the errors at the top still.


// build the form
$fields = array();
$this->load->library('validator');
		
$fields['name'] = array('label' => 'Name', 'required' => TRUE, 'class' => 'input left');
$this->validator->get_error('name');
$fields['email'] = array('label' => 'Email', 'required' => TRUE, 'class' => 'input left');
$this->validator->get_error('phone');
$fields['phone'] = array('label' => 'Phone', 'required' => FALSE, 'class' => 'input left');
$this->validator->get_error('message');
$fields['message'] = array('type' => 'textarea', 'label' => 'Message', 'required' => TRUE, 'class' => 'input left');
		
$this->form_builder->set_fields($fields);
		
// will set the values of the fields if there is an error... must be after set_fields
$this->form_builder->set_validator($this->validator);
$this->form_builder->set_field_values($_POST);

$vars['form'] = $this->form_builder->render();
	
		
// use Fuel_page to render so it will grab all opt-in variables and do any necessary parsing
$page_init = array('location' => 'contact', 'render_mode' => 'cms');
$this->load->module_library(FUEL_FOLDER, 'fuel_page', $page_init);
$this->fuel_page->add_variables($vars);
$this->fuel_page->render();
}
	
function _process($data)
{
	$this->load->library('validator');
	$phone = $this->input->post('phone');
	
	// rules for the form elements
	$this->validator->add_rule('name', 'required', 'Please tell us your name!', $this->input->post('name'));
	$this->validator->add_rule('email', 'required', 'Please tell us your email address!', $this->input->post('email'));
	$this->validator->add_rule('email', 'valid_email', 'This email seems incorrect, please try again!', $this->input->post('email'));
	if(!is_null($phone) && !empty($phone))
	{
		$this->validator->add_rule('phone', 'valid_phone', 'This format doesn\'t look right. Try this one: xxx-xxx-xxxx.', $this->input->post('phone'));
	}
		
	$this->validator->add_rule('message', 'required', 'Don\'t be shy, tell us what\'s on your mind!', $this->input->post('message'));
		
	// if the form validates successfully
	if ($this->validator->validate())
	{

admin · October 2011

Putting the error messages next to the field, won't work using Form_builder (sorry... I didn't glean that from above). Form_builder displays the errors at the top and highlights the fields red. To place the errors next to each field, you would need to create the form using the more manual HTML way unfortunately.

Howdy, Stranger!

Categories

How to display form error messages above each specific form element?

Comments