Set a Zend Decoration for radio element - zend-framework

I need to set a decoration for to print:
<input type="radio" id="option1" name="option" value="foo">
<label for="option1"></label>
<label>Option 1</label>
using Zend_Form_Element_Radio.
I've tried:
$pass = new Zend_Form_Element_Radio('options');
$pass->setLabel('Bloquear:')
->setRequired(true)
->addMultiOptions(array(
'option1' => '<label for="options-1"></label><label>Option 1</label>',
'option2' => '<label for="options-2"></label><label>Option 2</label>'));
return $pass;
but it prints the labels like a not HTML. Suggestions?

you have to define custom decorator as below example to manage with <ul> and <li>
it would be easy to apply css on bases of ul and li. take look on that
$this->addElement('radio', 'Bloquear', array(
'decorators' => array(
'ViewHelper',
array(array('AddTheLi' => 'HtmlTag'), array('tag' => 'li')),
array(array('AddTheUl' => 'HtmlTag'), array('tag' => 'ul')),
'Errors',
array('Description', array('tag' => 'p', 'class' => 'description')),
// specifying the "div" tag to wrap your <label> elements is not strictly
// necessary, but it produces valid XHTML if your form elements are wrapped
// in block-level tags like "<li>" (see next comment)
array('Label', array('tag' => 'div')),
// uncomment the following if all of your form elements are wrapped in "<li>"
//array('HtmlTag', array('tag' => 'li')),
),
'disableLoadDefaultDecorators' => true,
'label' => 'Bloquear',
'separator' => '</li><li>',
'attribs' => array(
'options' => array(
'foo' => 'Option 1',
'bar' => 'Option 2',
'baz' => 'Option 3'
),
),
));
please let me know if i can assist you more.

Related

Zend_Form Decorators, css and displaygroups

I'm trying with DisplayGroups in my form. I'm sure it is a css understanding problem.
This is how my form looks like:
Now I would love to make it nicer:
How can I move the legend of the Displaygroup onto the border?
How can I make the distance smaller between my labels an the fields?
Here is my formclass:
$this->setName('Schwestern');
$this->setMethod('post');
$vorname=$this->addElement('TextBox','vorname',array(
'label' => 'Vorname:',
));
$nachname=$this->addElement('TextBox','nachname',array(
'label' => 'Nachname:',
));
$strasse=$this->addElement('TextBox','strasse',array(
'label' => 'Strasse:',
));
$plz=$this->addElement('TextBox','plz',array(
'label' => 'PLZ:',
));
$ort=$this->addElement('TextBox','ort',array(
'label' => 'Ort:',
));
$telefon=$this->addElement('TextBox','telefon',array(
'label' => 'Telefon:',
));
$handy=$this->addElement('TextBox','handy',array(
'label' => 'Handy:',
));
$email=$this->addElement('TextBox','email',array(
'label' => 'Email:',
));
$geburtsdatum = $this->addElement('DateTextBox','geburtsdatum',array(
'label' => 'Geburtsdatum:',
'datePattern' => 'dd-MM-yyyy'
));
$this->addDisplayGroup(array(
'vorname',
'nachname',
'strasse',
'plz',
'ort',
'geburtsdatum'
),'contact',array('legend' => 'Name und Anschrift'));
$contact = $this->getDisplayGroup('contact');
$contact->setDecorators(array(
'FormElements',
'Fieldset',
array('HtmlTag',array('tag'=>'div','style'=>'width:200px;;float:left;border-style:solid; margin:5px;padding:5px;border-width:1px;border-color: grey;'))
));
$this->addDisplayGroup(array('telefon','handy','email'), 'kontaktdaten',array('legend'=>'Kontaktdaten'));
$this->getDisplayGroup('kontaktdaten')->setDecorators(array(
'FormElements',
'Fieldset',
array('HtmlTag',array('tag'=>'div','style'=>'width:200px;;float:left;border-style:solid; margin:5px;padding:5px;border-width:1px;border-color: grey;'))
));
$this->setDecorators(array(
'FormElements',
array(array('data'=>'HtmlTag'),
array('tag'=>'table','cellspacing'=>'6')),
'DijitForm'
));
EDIT 22/10/2015:
HTML Output of this part of the form:
Before I tried to use the fieldsets I decorated my forms like this:
$vorname=$this->addElement('TextBox','vorname',array(
'label' => 'Vorname:',
));
$vorname->setDecorators(array(
'ViewHelper',
'Description',
'Errors',
array(array('data'=>'HtmlTag'), array('tag' => 'td')),
array('Label', array('tag' => 'td')),
array(array('row'=>'HtmlTag'),array('tag'=>'tr'))
));
So can I use the decorators, or what would be the best solution to get this form nicer like I described above?

Zend Form add span to dd

I am trying to make custom decorators and I came to an issue.
Below is my code:
$oElement->setDecorators(array(
'ViewHelper',
array(array( 'data' => 'HtmlTag'),
array('tag' => 'dd', 'span' => 'myspan', 'class' => $class . ' myclass ' )),
array('Label', array('tag' => 'dt', 'class' => $class))
));
I want to add a span inside the dd so that after rendering the form it looks like:
<dd class="myclass"> <span> </span> </dd>
What am I missing here?
I can't test this as don't have Zend installed on my tablet, but think you have to add the span:
$oElement->setDecorators(array(
'ViewHelper',
array(array('data' => 'HtmlTag'),
array('tag' => 'span', 'class' => $class . 'myspan')),
array(array('span' => 'HtmlTag'),
array('tag' => 'dd', 'class' => $class . 'myclass')),
array('Label', array('tag' => 'dt', 'class' => $class))
));
I remember getting fed up with Zend decorators personally and Zend Forms in general as it felt like it took more effort than just making forms in HTML. Hope this helps anyway.

Zend Framework: What is the right way of setting default decorators for Zend_Form elements

i currently set my default decorators for my Zend_Form using a class extending from Zend_Form ...
class Application_Form_Abstract extends Zend_Form {
...
function loadDefaultDecorators() {
if ($this->loadDefaultDecoratorsIsDisabled()) {
return $this;
}
// ... for elements
$decorators = $this->_elementDecorators;
if (empty($decorators)) {
$this->setElementDecorators(array(
'ViewHelper',
'Errors',
array('Description', array('tag' => 'p', 'escape' => false)),
'Label',
array('HtmlTag', array('tag' => 'p'))
));
but i soon realize that that way, i cannot define specific element decorators like
$this->addElement('textarea', 'bio', array(
'decorators' => array(
'ViewHelper',
'Errors',
array('Description', array('tag' => 'p', 'escape' => false)),
'Label',
array('HtmlTag', array('tag' => 'p')),
new Application_Form_Decorator_WmdPreview,
)
));
as they will be over-written by my custom loadDefaultDecorators() function. i wonder if there is any way i can set default decorators for element only if they have no set decorators
You can disable the default decorator for 'bio' element by adding a call to setDisableLoadDefaultDecorators()
$this->addElement('textarea', 'bio', array(
'disableLoadDefaultDecorators' => true,
'decorators' => array(
'ViewHelper',
'Errors',
array('Description', array('tag' => 'p', 'escape' => false)),
'Label',
array('HtmlTag', array('tag' => 'p')),
new Application_Form_Decorator_WmdPreview,
)
));
Also to you save you a headache, displaygroups cannot have the same name as any element that they contain

ZendX_JQuery dialogContainer usage

I'm aming to make use of the ZendX_JQuery dialogContainer view helper, in order to produce a modal window, were users can input specified information(for example send a message). I'm trying to use the dialogContainer view helper in this fashion.
First of, include the ZendX library in the applications library folder.
Secondly, include the following row in the initViewHelper method within the Bootstrap.php file
"$view->addHelperPath('ZendX/JQuery/View/Helper/', 'ZendX_JQuery_View_Helper');"
third, adding the following conditional enabling of js in the layout.phtml
"<?php if($this->jQuery()->isEnabled()){
$this->jQuery()->setLocalPath($this->baseUrl()
.'/js/jquery/js/jquery-1.4.2.min.js')
->setUiLocalPath($this->baseUrl()
.'/js/jquery/js/jquery-ui-1.8.custom.min.js')
->addStylesheet($this->baseUrl()
.'/js/jquery/css/ui-lightness/jquery-ui-1.8.custom.css');
echo $this->jQuery();
}
?>"
fourth, creating my Application_Form_JQueryForm extending ZendX_JQuery_Form
"<?php
class Application_Form_JQueryForm extends ZendX_JQuery_Form
{
private $form;
public function init()
{
$this->form = $this->setAction(Zend_Controller_Front::getInstance()->getBaseUrl() . '/index/index')
->setMethod('post');
$this->form->setDecorators(array(
'FormElements',
'Form',
array ('DialogContainer', array(
'id' => 'tabContainer',
'style' => 'width: 600px;',
'title' => 'Send a private message to Kalle',
'JQueryParams' => array(
'tabPosition' => 'top',
),
)),
));
$topic = new Zend_Form_Element_Text('topic');
$topic->setValue('topic')
->setRequired(true)
->setValidators(array('validators' => array(
'validator' => 'StringLength',
'options' => array(1,15)
)))
->setDecorators(array(
'ViewHelper',
'Description',
'Errors',
array('HtmlTag', array('tag' => 'dl'))));
$textarea = new Zend_Form_Element_Textarea('textarea');
$textarea->setValue('post a comment')
->setAttribs(array(
'rows' => 4,
'cols' => 20
))
->setRequired(true)
->setValidators(array('validators' => array(
'validator' => 'StringLength',
'options' => array(1,15)
)))
->setDecorators(array(
'ViewHelper',
'Description',
'Errors',
array('HtmlTag', array('tag' => 'dl'))));
$submit = new Zend_Form_Element_Submit('submit');
$submit->setLabel('Send your comment')
->setDecorators(array(
'ViewHelper',
'Description',
'Errors',
array('Description', array('escape' => false, 'tag' => 'span')),
array('HtmlTag', array('tag' => 'dl'))))
->setDescription('or Cancel');
$this->form->addElements(array($topic, $textarea, $submit));
}
}"
This form is then instanciated in the controllers action method, and called in the view.
And so to the problem of mine, no matter what i try, in order to for instance set, the width of the dialogContainer or any other parameter (color, css, height, so on and so forth), this being in the JQueryForm's setDecorator part for the form, i can't seem to get any change whatsoever in the resulting modal when called in the view, any help in the proper direction would be greatly appreciated
Thanks in advance, Kalle Johansson
A late answer for sure - but lots of views - so figured I would answer. The parameters you want to set for the modal should be set from the JQueryParams array. So - for example:
$this->form->setDecorators(array(
'FormElements',
'Form',
array ('DialogContainer', array(
'id' => 'tabContainer',
'style' => 'width: 600px;',
'title' => 'Send a private message to Kalle',
'JQueryParams' => array(
'tabPosition' => 'top',
'width' => '600',
'height' => '450'
),
)),
));
You can find these param options on the jQuery UI site.
LK

Table Decorators on Zend Framework Form

i created a form that it decorates as table form
its my code for decorates
$this->setElementDecorators(array(
'ViewHelper',
'Errors'
array(array('data'=>'HtmlTag'),
array('tag'=>'td','class'=>'element')),
array('Label',array('tag'=>'td')),
array(array('row'=>'HtmlTag'),array('tag'=>'tr')),
));
$this->setDecorators(array(
'FormElements',
array('HtmlTag',array('tag'=>'table')),
'Form'
));
it works correctly,
now i wana errors message decorates too
what do i change my code?
Here is a rather complex way of doing it. I have added classes to the decorators too so you can style them unlike your example.
// To be assigned at the beginning of your form class.
public $elementDecorators = array(
'ViewHelper',
'Errors',
array(array('data' => 'HtmlTag'), array('tag' => 'td', 'class' => 'col2')),
array('Label', array('tag' => 'td','class'=>'taR')),
array(array('row' => 'HtmlTag'), array('tag' => 'tr','class' => 'rowA')),
);
$this->addElement('ValidationTextBox', 'name', array(
'decorators' => $this->elementDecorators,
'validators' => array(
array('regex', false,'/^[a-zA-Z ]+$/')
),
'label' => $this->translator->translate ( 'Name' ) . ' : ',
'required' => true,
'trim' => true,
'propercase' => true,
'regExp' => '[a-zA-Z ]+',
'invalidMessage' => $this->translator->translate ( 'Name - Must be alpha numeric.' )
)
);
If you want to show all erros grouped in one place you should remove the Error decorator from each element and then add to you form the formErrors decorator. Here is an example from How to remove Zend Form error messages?
$form->setDecorators(array(
'FormElements',
new Zend_Form_Decorator_FormErrors(array
(
'ignoreSubForms' => true,
'markupElementLabelEnd' => '</b>',
'markupElementLabelStart' => '<b>',
'markupListEnd' => '</div>',
'markupListItemEnd' => '</span>',
'markupListItemStart' => '<span>',
'markupListStart' => '<div id="Form_Errors">'
)
),
'Form'
));