CODEWITHSUNDEEP
phpcakephpcakephp-2.0
Dail
Dail

Reputation: 4606

How to set up custom error class using Form Helper of CakePHP 2.2.4?

I have a "special" request. I have started with CakePHP 2.2.4 few days ago, now I'm developing few small forms using Form Helper.

I saw that Form Helper manage the errors automatically (awesome!), but I need to do few customizations. I know that I can change the class of the error (error-message) and use, for example, a span instead of the div.

But, I need to change the class OF the input IF there is an error.

<?php

echo $this->Form->input('User.email', array(
                                    'label' => array(                                                                       
                                        'class' => 'name-form',
                                        'text'  => 'Email:'
                                    ),                                                              
                                    'div'   => 'field', 
                                    'class' => 'input-xlarge'
                                )
                       );

?>

as you can see the class that i use is named input-xlarge

I need to change that class IF THERE IS an error. The new class should be input-xlarge-error.

This class only change the border of the input text setting it to red.

Is this possible?

Thank you!

Upvotes: 1

Views: 2137

Answers (3)

iqqmuT
iqqmuT

Reputation: 843

What you can do is to create your own FormHelper class and override addClass() method:

class BootstrapFormHelper extends FormHelper {
    public function addClass($options = array(), $class = null, $key = 'class') {
        if ($class === 'error') {
            $class .= ' has-error';
        }
        return parent::addClass($options, $class, $key);
    }
}

Upvotes: 2

Christos Hrousis
Christos Hrousis

Reputation: 715

Think about the logic of your question:

"If there is an error I want the class of the div to be x, otherwise y".

There are a couple of ways to accomplish this, if all you need to do is flip the class based on error, then FormHelper::isFieldError will suffice...

<?php
echo $this->Form->input('User.email', array(
         'label' => array(                                                                       
             'class' => 'name-form',
             'text'  => 'Email:'
          ),                                                              
          'div'   => 'field', 
          'class' => $this->Form->isFieldError('User.email') ? 'input-xlarge-error' : 'input-xlarge'
));
?>

The above will not stop the "form-error" class from being appended to the input. (solutions for that are outside the scope of the question)

The reason I answered this question is because I needed to specifically set the error class on my input to work with bootstrap 3 the way I wanted. This can also help with input classes being wiped on error. You may also want to review the options available for FormHelper::input() which I link below. For more complex control over error, there is a FormHelper::Error which is even more robust, you can find this all on the cakephp website....

http://book.cakephp.org/2.0/en/core-libraries/helpers/form.html

Upvotes: 2

cowls
cowls

Reputation: 24334

Why do you need to change the class of the input if there is an error?

You can target the input using the class that has been appended to the outer div.

E.g.

div.error input { }

You can then style the input differently if there is an error.

All you need in the view is:

<?php echo $this->Form->create('User'); ?>
<?php echo $this->Form->input('email'); ?>
<?php echo $this->Form->end('Submit'); ?>

This should provide you with a quick example. Submit the form and then inspect the element to see where the error class has been added.

You can probably get away with:

.error input { border: red; }

In the CSS

Upvotes: 2

Related Questions