Cakephp 3 Form helper checkbox template

Question

I am trying to change the checkbox template which at the moment looks like

'checkbox' => '<input type="checkbox" name="{{name}}" value="{{value}}"{{attrs}}>',
'checkboxWrapper' => '{{label}}',

which generates html like

<div class="form-group">
 <input class="form-control" type="hidden" name="active" value="0">
  <label for="active">
   <input type="checkbox" name="active" value="1" id="active">
    Active
  </label>
 </div>
</div>

But what I need is that the code should look like

<div class="checkbox m-b-15">
 <input class="form-control" type="hidden" name="active" value="0">
 <label>
  <input type="checkbox" name="active" value="1" id="active">
   <i class="input-helper"></i>
   Active
 </label>
</div>

How should I actually change the template and which templates of FormHelper so that the code look like I need?

You've presumably read the Customizing the Templates FormHelper Uses documentation. Show us the code you have tried, and tell us specifics of what isn't working about it. — Greg Schmidt
– Greg Schmidt, Commented Nov 17, 2016 at 23:52

RavatSinh Sisodiya · Accepted Answer · 2017-03-20 07:09:37Z

2

You can use nestingLabel form template to format your checkbox layout. Use {{input}} {{hidden}} and label

Use following code before your checkbox.

$this->Form->setTemplates([
      'nestingLabel' => '<div class="checkbox m-b-15">{{hidden}}<label{{attrs}}>{{input}}{{text}}</label></div>',
]);

Reference: vendor/cakephp/cakephp/src/View/Helper/FormHelper.php
protected $_defaultConfig = [...]

answered Mar 20, 2017 at 7:09

RavatSinh Sisodiya

1,6161 gold badge21 silver badges42 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

obinoob · Accepted Answer · 2017-09-13 18:58:24Z

you can write a custom checkbox, input text etc by using a custom widget! Please read about here: https://book.cakephp.org/3.0/en/views/helpers/form.html#using-widgets

If you still having troubles you can always use my example. Keep in mind that I'm using fully costumized checkbox css is not provided this is just an example in order to help you understand how it works.

What you need:

Create a widget
Load the widget
Load the template in your form view
Render the checkbox :)

In order to write your custom checkbox you need to create a CustomCheckboxWidget class that extends BasicWidget. Now, all you need to do is customize your render function.

This is a complete example: CustomCheckboxWidget

*To use your custom template you need to load the widget by adding the following lines to App.View.php

'Form' => [
   'widgets'  => [
   'custom'  => ['App\View\Widget\CustomCheckboxWidget']
   ],
],

At the initialize function...

In you view form example.ctp just add:

$this->Form->setTemplates([
   'checkbox' => '<div class="{{checkboxstyle}}">'.
   '<input type="checkbox" name="{{name}}" id="{{name}}" value="{{value}}"{{attrs}}>'.
   '<label for="{{name}}"><span class="{{bold}}">{{text}}{{icon}}</span></label>'.
   '{{error}}'.
   '</div>'
]);

And render the custom checkbox obviously:

<?= $this->Form->custom('field',[
   'hiddenField' => false,
   'displayMessage' => true,
   'checkboxstyle' => 'checkbox checkbox-danger',
   'text' => 'Some label'
   ]);
?>

Regards,

Collectives™ on Stack Overflow

Cakephp 3 Form helper checkbox template

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related