I have a zend form and a I need the final Output HTML of the Radio Group to be like this :
<div>
<span class='radio_title'>Gender</span> <!-- The issue is in this line -->
<span class='felement'>
<label ....> <input type="radio" ...... value="male" /></label>
<label ....> <input type="radio" ...... value="female" /></label>
</span>
</div>
(i.e.) Replace the default dt and dd with customized div or span tags
I created a decorator as follows:
$decorator = array(
'ViewHelper',
'Errors',
array(array('data' => 'HtmlTag'), array('tag' => 'span', 'class'=> 'felement')),
// the next line is never applied
array('Label', array('tag' => 'span', 'class'=> 'fradio' , 'placement'=>'prepend') ),
array(array('row' => 'HtmlTag'), array('tag' => "div"))
);
$gender = new Zend_Form_Element_Radio("gender",
array(
"label"=>"Gender",
'multiOptions'=>array(
'male'=>'Male',
'female'=>'Female'
),
"decorators"=>$decorator
));
and I got this output instead:
<dt id="gender-label">
<label class="optional">Gender</label>
</dt>
<!-- i don't know why the Main Label of the radio group didn't
have the Label decorator applied to it -->
<div>
<span class="felement">
<label for="gender-male"><input type="radio" disablefor="1" checked="checked" value="male" id="gender-male" name="gender">Male</label>
<label for="gender-female"><input type="radio" disablefor="1" value="female" id="gender-female" name="gender">Female</label>
</span>
</div>
I Applied this Decorator:
array(
'ViewHelper',
'Errors',
array(array('data' => 'HtmlTag'), array('tag' => 'div', 'class'=> 'fradioelement')),
array('Label', array('tag' => 'span', 'class'=> 'fradiotitle') ),
array('description', array('tag' => 'span')),
array(array('row' => 'HtmlTag'), array('tag' => "div","class"=>"radioelement"))
);
And it gave me this output:
<div class="radioelement">
<span id="gender-label"><label class="fradiotitle optional" for="gender">Gender</label></span>
<div class="fradioelement">
<label for="gender-male"><input type="radio" checked="checked" value="male" id="gender-male" name="gender">Male</label>
<label for="gender-female"><input type="radio" value="female" id="gender-female" name="gender">Female</label>
</div>
</div>
Which is almost what I needed.
** I had to add :
'disableLoadDefaultDecorators' => true
in the options of the element