How to override default HTML Helper of Cakephp?

Question

I'm given theme by designer and I'm assigned to integrate it with the product. Since the product size in term of source code is massive, I have to modify almost all the views and layouts. Moreover, the development of the product will go for next 2 years which is plan.

I'm trying to override HTML Helper class of Cakephp so that it will change all the default classes of css. Due to this strategy developers won't have to utilize more effort to for views and it will ease future development. Right now

echo $this->Form->input('username');

Generates

<div class="input text required">
    <label for="username">Username</label>
    <input id="username" type="text" required="required" maxlength="30" name="data[User][username]">
</div>

And I want this by overriding HTML Helper.

<div class="form-group has-error">           
    <label for="inputError" class="control-label">Input with error</label>
    <input type="text" id="username" class="form-control" name=" data[User][username]" required="required">                           
</div>

This is one example of textbox. Please assists, thanks in advance.

Answer 1

I think you can't override it. But you can build another helper extending the FormHelper.

I did that once to turning my form creation proccess more simple to do with the Bootstrap css built-in classes.

class BFormHelper extends FormHelper {

    public function label($fieldName = null, $text = null, $options = array()){
        $myOptions = array('class' => 'control-label');
        return parent::label($fieldName, $text, array_merge($options, $myOptions));
    }
}

That way we encapsulate the use of the CSS class control-label , and in case of need to change it, we only need to do it in one place.

Then, on the view you simply do:

<?= $this->BForm->label('somefield', 'Some bootstrap field') ?>

The CakePHP version I did this was 1.3.

Answer 2

That looks like you are using the bootstrap css framework. I recommend you to use this plugin:

http://slywalker.github.io/cakephp-plugin-boost_cake/

Answer 3

In order to generate the code above, you can always use the core FormHelper like that:

<?php
echo "<div class=\"form-group has-error\">."
    . $this->Form->label('username', '<your-text-goes-here>', array('class' => 'control-label'))
    . $this->Form->input('username', array('class' => 'form-control', 'label' => false, 'div' => false))
    . "</div>\n";
?>

The core FormHelper can be fully customized to meet your needs. But this way implies that your will have to give extra effort in your views. Read the corresponding section in cakebook on how to customize the core FormHelper .

If you want to minimize the code in your views, you can create a custom form helper like the sample given below.

<?php
class CustomformHelper extends AppHelper {
    public $helpers = array('Form');

    public function customInput(<your-options-goes-here>) {
        /* Write your custom code for the specific type of input
         * you want to create. */
    }
};
?>

In your custom helper, you can introduce any other of the core helpers, by defining the $helpers array, like you did it in your controllers.

All the core helpers you defined in $helpers array are available from withing $this . For example if you want to call the FormHelper::input() method, from within your custom method, you can use the following code: $this->Form->input(...)

See also the section on how to create custom helpers in the cakebook