Radio button group

Need Help
1

Hi

Anyone ever created a radio button group with the form helper?

I have a form with a working radio button group with images instead of buttons

I did it with html and php

I now need to use the security component on this form so i’ve been trying to figure out how to replicate what i have using the form helper

$this->Form->radio() is what i’m using. I’m not at my computer now but i’m doing something like the following

<?php $opt = array(); foreach($things as $thing) { ?>

$opt = [‘value’ => $thing->someproperty, ‘text’ => ‘Red’, ‘style’ => ‘color:red;’];

<?php } ?>
<?= $this->Form->radio('name', $opt) ?>

The array is empty when i debug it.

Any idea what I’m doing wrong here?

Is it that when i generate the radio button within the cake tags <?= ?> it can’t see the array that came from the <?php ?> tagged section?

2

Hi

So i figured out what was going on with the array.

It wasn’t empty

$this->Form->radio ignores the array if it doesn’t have a ‘text’ value

I ended up copying and pasting the example from the docs into my form and then replacing the values with the ones i wanted. When i replaced the ‘text’ value it went back to ignoring the array and the ‘value’ in the generated HTML went back to being 0, 1, and 2 for the three radio inputs.

So i’ve got a little further. The buttons appear as they should and they work as expected. The only remaining problem is that the css related.

The hover style works but the select one doesn’t. I think it’s to do with the loop. I’m building the labels for the radio inputs in the foreach and then generating the radio inputs after. Here’s the generated HTML:

 <div class='button-group toggle' data-toggle='buttons-radio'>                        
              
              <label class='button radius' for='thing-id-1' >
                <figure>
                  <img class="" src="/img/things1.png" /> 
                  <figcaption>Things 1</figcaption>
                </figure>  
              </label>
                          
              <label class='button radius' for='thing-id-2' >
                <figure>
                  <img class="" src="/img/thing2.png" /> 
                  <figcaption>Thing 2</figcaption>
                </figure>  
              </label>                        
              
              <label class='button radius' for='thing-id-3' >
                <figure>
                  <img class="" src="/img/thing3.png" /> 
                  <figcaption>Thing 3</figcaption>
                </figure>  
              </label>
             
        
        <input type="radio" name="thing_id" value="1" id="thing-id-1" data-toggle="button">
       <input type="radio" name="thing_id" value="2" id="thing-id-2" data-toggle="button">
       <input type="radio" name="thing_id" value="3" id="thing-id-3" data-toggle="button">               
 </div>

I cobbled the working html version together from a couple of examples i think. Then i needed to make sure the form was secure so i tried to replicate the html using the form helper. Would really appreciate it if someone could help out here as i’m struggling.

I was wondering if i just used the HTML version but added the hidden field that stores the value using the form helper would that be secure? Will the form submit only the hidden field or will it submit the html radio inputs?

Would be great if someone could answer that one!

3

Ok so i’m dangerously close to answering my own question here again.

The following code works:

<?php echo $this->Form->templates(['nestingLabel' => '{{input}}{{text}}','formGroup' => '{{input}}{{label}}',]); 
          echo $this->Form->hidden('thing_id', ['type' => 'text', 'value' => 1]);    

          foreach($things as $thing) {   
                    
              echo $this->Form->radio('thing_id',[ 
                                                  ['id' => 'thing-id-' . $thing->id, 'value' => $thing->id, 'text' => 'test', 'data-toggle' => 'button']
                                                  ],
                                                    [
                                                    'label' => [
                                                              'class' => 'button radius',
                                                              'for' => 'thing-id-' . $thing->id,
                                                              'text' => '<figure><img src= ' . $thing->img . '/><figcaption>' . $thing->title . '</figcaption></figure>',
                                                              'escape' => false  
                                                              ], 
                                                              'hiddenField' => false
                                                    ]);      
           
             
        } ?>

The problem now is there’s an error i don’t really understand. It’s coming from the following line of code:

echo $this->Form->templates([‘nestingLabel’ => ‘{{input}}<label{{attrs}}>{{text}}’,‘formGroup’ => ‘{{input}}{{label}}’,]);

I have that line to make the inputs appear outside the labels.

Here’s the error text:

Object of class Cake\View\Helper\FormHelper could not be converted to string

Any chance someone out there has come across this before?

Would really appreciate some help here as it’s taken me a week to figure out how to reproduce some basic html using the form helper and according to my wife it’s making me irritable. So please, for the sake of my marriage, somebody answer this one!

Cheers