CakePHP form helper - HABTM multiple checkbox styling

Question

I have two tables: "restaurants" and "cuisines" which are related to each other by a HABTM table

The table cuisines has certain fixed entries - 54 number

A restaurant can have any number of cuisines. On baking the application this came with a multiple select. Since i wanted check boxes i used array( 'type' => 'select', 'multiple' => 'checkbox') to convert it into checkboxes.

Now i want to style the way this checkboxes are displayed into columns of 4 as seen on the screenshot below.

img2.pict. com/82/bc/a4/1453459/0/200908111511.png

echo $form->input('Cuisine', array('type' => 'select', 'multiple' => 'checkbox'));  

The above code produces many div's around each element as follows

http://img2.pict.com/1a/a3/0a/1453457/0/200908121509.png

I have tried the following:

echo $form->input('Cuisine', array( 'type' => 'select', 'multiple' => 'checkbox', 'div' => false, 'label' => false));

but this code only removes the outside divs and label. I am not able to control the internal

<div class="checkbox">
<label for="CuisineCuisine2">Andhra</label>

that appear around the single checkboxes.

How can I use the FormHelper to remove or give classes to the internal divs, so I can do some custom styling? Or is there any other way to populate this HABTM table to get the effect i want?

Answer 1

You could get around this by doing $form->select() instead, and apply a style or class attribute to get it to look how you want.

It seems to make sense to not use the $form->input() function if you are going to remove the div and label anyway.

Answer 2

You can stylize the DIV elements with CSS.

<style>
div.input div.checkbox {
    float: left;
    width: 50%;
}
</style>

Answer 3

You can remove or give classes to the internal divs like this

$this->Form->input("hello_test",array('type'=>'checkbox','div'=>'class_name'));

By default cake uses : type class e.g - type is checkbox then class="checkbox"