Hi,

While using tabs in Dojo forms (as explained in ZF doc), I encountered an issue: the tab container inherits forbidden attributes from the form itself (name, method, action).

Likewise, would someone explain me how to get the submit button outside of the tab container?
(See below the way I tried.)

Thanks,
--
Guillaume

Here is the form class:
class Form_Customer extends Zend_Dojo_Form
{
    public function init()
    {
        $this->setName(get_class($this))->setMethod('post');
        $this->setDecorators(array(
            'FormElements',
            array('TabContainer', array(
                'id'          => 'tabContainer',
                'style'       => 'width: 100%; height: 450px;',
                'dijitParams' => array('tabPosition' => 'top'),
            )),
            'DijitForm',
        ));

        $tab1 = new Zend_Dojo_Form_SubForm();
        $tab1->setAttribs(array(
            'name'   => 'firsttab',
            'legend' => 'Legend 1',
            'dijitParams' => array('title' => 'Title 1')));

        $el = new Zend_Dojo_Form_Element_TextBox('first_name');
        $el->setLabel('first name');
        $tab1->addElement($el);

        $tab2 = new Zend_Dojo_Form_SubForm();
        $tab2->setAttribs(array(
            'name'   => 'secondtab',
            'legend' => 'Legend 2',
            'dijitParams' => array('title' => 'Title 2')));

        $el = new Zend_Dojo_Form_Element_TextBox('last_name');
        $el->setLabel('last name');
        $tab2->addElement($el);

        $this->addSubForm($tab1, 'firsttab')
             ->addSubForm($tab2, 'secondtab')
->addElement('Button', 'foo', array('label' => 'Button Label'));
    }
}

And the generated HTML code:

<form  id="Form_Customer"method="post"action="/customer/add">
  <div  
name="Form_Customer"method="post"action="/customer/add"id="Form_Customer-TabContainer"style="width:
 100%; height: 450px;">
    <div  name="firsttab"id="firsttab-ContentPane"><dl>
      <dt  id="first_name-label"><label  for="firsttab-first_name"class="optional">first 
name</label></dt>
      <dd><input  
id="firsttab-first_name"name="firsttab[first_name]"value=""type="text"/></dd>
    </dl></div>

    <div  name="secondtab"id="secondtab-ContentPane"><dl>
      <dt  id="last_name-label"><label  for="secondtab-last_name"class="optional">last 
name</label></dt>
      <dd><input  
id="secondtab-last_name"name="secondtab[last_name]"value=""type="text"/></dd>
    </dl></div>

    <dt  id="foo-label">&nbsp;</dt>
    <dd  id="foo-element"><button  name="foo"id="foo"type="button">Button 
Label</button></dd>
  </div>
</form>

--

Guillaume ORIOL

Reply via email to