Hey Michael,

I accomplish this with a combination of decorators, display groups, and css.

I set up some custom decorators as protected properties of my form, apply
them to my fields in the display group, apply custom decorators to the
display group itself, and css takes care of the rest.  Here's an example of
a first name, last name display group with first and last name inputs on the
same line.

First, the input elements:

$this->addElement('text', 'firstName', array(
  'decorators' => $this->_standardGroupElementDecorator,
  'size'       => 8,
  'label'      => 'First',
  'class'      => 'field text',
));

$this->addElement('text', 'lastName', array(
  'decorators' => $this->_standardGroupElementDecorator,
  'size'       => 14,
  'label'      => 'Last',
  'class'      => 'field text',
));

$this->addDisplayGroup(array(
    'firstName',
    'lastName'
  ),
  'name',
  array(
    'disableLoadDefaultDecorators' => true,
    'decorators'                   => $this->_standardGroupDecorator,
    'label'                        => 'Name',
   )
);

Now the decorators:

protected $_standardGroupElementDecorator = array(
    array('Label', array('escape' => false)),
    array('ViewHelper', array('placement' => 'prepend')),
    array('HtmlTag', array('tag' => 'span')),
  );

protected $_standardGroupDecorator = array(
    'FormElements',
    array('Label', array('class' => 'desc', 'requiredSuffix' => ' *',
'escape' => false)),
    array('HtmlTagError', array('tag'=>'li')),
  );

Here's how I set the form decorators (not to be confused with element
decorators):

$this->setDecorators(array(
      'FormElements',
      array('HtmlTag', array('tag' => 'ul')),
      'Form'
    ));
   
    // Subform decorators
    $this->setSubFormDecorators(array(
      'FormElements',
    ));

While most of the decorators above are standard Zend_Form_Decorators, the
HtmlTagError decorator is a home-grown custom decorator.  It allows for
adding error to the display group as opposed to the individual elements in
the display group.  The code for that decorator can be seen at
http://pastebin.com/ffff8304.  It's a little much to copy here.

If you do use custom decorators, make sure to add an element prefix path at
the top of the form's constructor:

$this->addElementPrefixPath('Kendall_Form_Decorator',
'Kendall/Form/Decorator/', 'decorator');

Finally, I also implement a custom display group class:
http://pastebin.com/f2b858cbb

If you go that route, make sure to add the display group class at the top of
the form's constructor:

$this->setDefaultDisplayGroupClass('Kendall_Form_DisplayGroup');

See www.wufoo.com for the css that I use.  I've always loved the way their
forms look and decided to make my Zend forms look like theirs.

Best,

JK

-- 
Jeremy

Blu Frog Energy - THE Energy Drink!
Get some! - www.gimmeblufrog.com

www.jeremykendall.net


Michel Morelli wrote:
> 
> Hi all. I have one form with some DisplayGroup Elements. 
> Some of these need that the elements must to be rendered in a 2 columns. 
> Like:
> 
> --Legend------------------------
> | Element 1                Element 2 |
> | Element 3                Element 4 |
> ---------------------------------
>           
> How can I do this ? I need to "play" with decorators and css class/id ?
> 
> Tnx.
> 
> -- 
> Michel 'ZioBudda' Morelli                       [email protected]
> Consulenza sistemistica in ambito OpenSource.
> Sviluppo applicazioni web dinamiche (LAMP+Ajax)
> Telefono: 0200619074
> Telefono Cell: +39-3939890025 --  Fax: +39-0291390660
> 
> http://www.ziobudda.net                         ICQ: 58351764  
> http://www.ziobuddalabs.it                      Skype: zio_budda
> http://www.ajaxblog.it                                MSN: 
> [email protected]                   
>                                               JABBER: [email protected]
> 
> 
> 


-----
Jeremy Kendall --  http://www.jeremykendall.net http://www.jeremykendall.net 
-- 
View this message in context: 
http://www.nabble.com/DisplayGroup-with-2-columns-element-tp21452641p21455081.html
Sent from the Zend Framework mailing list archive at Nabble.com.

Reply via email to