How to make custom Radio-Button labels in ZF2 forms?

Question

I have a form with Radio-button:

$this->add([
    'name' => 'time',
    'options' => [
        'value_options' => [
            '0' => '9:00 - 12:00',
            '1' => '12:00 - 16:00',
            '2' => '16:00 - 19:00',
        ],
        'label_attributes' => [
            'class' => 'WW_OBJ_fm-label',
        ]
    ],
    'type' => 'Radio'
]);

In the view I make the output like this:

<div> 
<?php echo $this->formElement($form->get('time')); ?>
</div>

and get the output (formatted for readability):

<div>
    <label class="WW_OBJ_fm-label">
        <input type="radio" name="time" value="0"/>
        9:00 - 12:00
    </label>
    <label class="WW_OBJ_fm-label">
        <input type="radio" name="time" value="1"/>
        12:00 - 16:00
    </label>
    <label class="WW_OBJ_fm-label">
        <input type="radio" name="time" value="2"/>
        16:00 - 19:00
    </label>
</div>

But I need, that label text ist wrapped by a <span>:

<div>
    <label class="WW_OBJ_fm-label">
        <input type="radio" name="time" value="0"/>
        <span class="WW_label-text">9:00 - 12:00</span>
    </label>
    <label class="WW_OBJ_fm-label">
        <input type="radio" name="time" value="1"/>
        <span class="WW_label-text">12:00 - 16:00</span>
    </label>
    <label class="WW_OBJ_fm-label">
        <input type="radio" name="time" value="2"/>
        <span class="WW_label-text">16:00 - 19:00</span>
    </label>
</div>

What is the best way to achieve it?

score 0 · Answer 1 · answered Dec 17 '15 at 23:58

A solution is to use labelOption 'disable_html_escape' :

$this->add([
        'name' => 'time',
        'options' => [
            'value_options' => [
                '0' => '<span class="WW_label-text">9:00 - 12:00</span>',
                '1' => '<span class="WW_label-text">12:00 - 16:00</span>',
                '2' => '<span class="WW_label-text">16:00 - 19:00</span>',
            ],
            'label_attributes' => [
                'class' => 'WW_OBJ_fm-label',
            ]
        ],
        'type' => 'Radio'
    ]);
$element = $this->get('time');
$element->setLabelOptions(['disable_html_escape' => true]);

Unfortunately this solution ist not aceptable, because the label of value-option will be used later in evaluation of the form values. — Gennadiy Litvinyuk, Dec 18 '15 at 06:31

score 0 · Accepted Answer · answered Dec 22 '15 at 11:14

0

I see three possible solutions for your problem.

1) Extend the Zend\Form\View\Helper\FormRadio class, overriding the renderOptions method, replicating almost entirely the one that you can find in Zend\Form\View\Helper\FormMultiCheckbox but maybe adding an option to pass optional attributes to the span element

2) Very subtle, but could save you writing some code: using the translator. Since the radio value options are translated, you could keep your values defined in the configuration but adding the span element in the transation

3) Do not use $this->formElement to display the element, but actually write all the html

answered Dec 22 '15 at 11:14

marcosh

8,780
5
44
74

I have already did what you wrote in solution 3. I personally prefer solution 1, but lots of duplicated code is not very attractive to me. – Gennadiy Litvinyuk Dec 22 '15 at 11:38
@GennadiyLitvinyuk I agree with you, altough it'll be just one method... other possibility is to a little refactoring and then do a pull request to the Zend guys, but that will certainly take some time – marcosh Dec 22 '15 at 12:00

How to make custom Radio-Button labels in ZF2 forms?

2 Answers2