views:

211

answers:

1

I am trying to recreate the following blog's tabbed forms for my website.

http://zendguru.wordpress.com/2009/01/15/zend-framework-and-dojo-creating-tabbed-form/

I currently have the form displaying on my page, however instead of tabs it displays the whole form like normal. I know that the form is displaying the subforms as I have commented them out and they disappear. Can someone help me find the path to enlightenment? I believe everything relevant is below. I have included the dojo Base 1.4.0 located

http://www.dojotoolkit.org/downloads

I have a link to the html being created here if that helps as well.

http://shortText.com/tljfsq6l37

I have the following AdminController.php page.

class AdminController extends Zend_Controller_Action
{

public function init()
{
    /* Initialize action controller here */
}

public function createeventAction()
{
    $this->view->page = 'createEvent';      
    $this->view->title = "Early Signup Administration";
    $this->view->headTitle($this->view->title, 'PREPEND');

    $createEventForm = new Form_CreateEvent();
    $this->view->form = $createEventForm;

}
}
?>

An CreateEvent.php Form

<?php
class Form_CreateEvent extends Form_Event
{
public function __construct($options = null) 
{
    parent::__construct($options = null); 

    $shirt_sizes = array('s' => 'Small', 'm' => 'medium', 'l' => 'large', 'xl' => 'X-Large', 'XX' => 'XX-Large', '3X' => 'XXX-Large');

    $this->setDecorators(array(
    'FormElements',
    array('TabContainer', array(
    'id' => 'tabContainer',
    'style' => 'width: 600px; height: 500px;',
    'dijitParams' => array(
    'tabPosition' => 'top'
    ),
    )),
    'DijitForm',
    ));        

    $this->setName('createEvent'); 
    $idEvent = new Zend_Form_Element_Hidden('idEvent');         

    $type = parent::setName($this->type);
    $name = parent::setName($this->name);
    $city = parent::setName($this->city);
    $state = parent::setName($this->state);
    $location = parent::setName($this->location);
    $date = parent::setName($this->date);
    $shirtRequired = parent::setName($this->shirtRequired);
    $eventImage = parent::setName($this->eventImage);
    $eventUrl = parent::setName($this->eventUrl);
    //$submit = parent::setName($this->submit);


    $shirtSize = new Zend_Form_Element_MultiCheckbox ('shirtSize');
    $shirtSize->setLabel('Shirt Size') 
              ->setRequired(false) 
              ->addMultiOptions($shirt_sizes)
              ->setValue(array('s','m','l','xl'))
              ->addFilter('StripTags') 
              ->addFilter('StringTrim');


    $directorEmail = new Zend_Form_Element_Text('email');
    $directorEmail->setLabel('Director\'s Email') 
          ->setRequired(false) 
          ->addFilter('StripTags') 
          ->addFilter('StringTrim');              

    $waiverTitle = new Zend_Form_Element_Text('waiverTitle');
    $waiverTitle->setLabel('Waiver Title') 
          ->setRequired(false) 
          ->addFilter('StripTags') 
          ->addFilter('StringTrim');              

    $waiverText = new Zend_Form_Element_Text('waiverText');
    $waiverText->setLabel('Waiver Text') 
          ->setRequired(false) 
          ->addFilter('StripTags') 
          ->addFilter('StringTrim');              

    $eventClosedMessage = new Zend_Form_Element_Text('eventClosedMessage');  
    $eventClosedMessage->setLabel('Event Closed Message') 
          ->setRequired(false) 
          ->addFilter('StripTags') 
          ->addFilter('StringTrim');              

    $logoFlag = new Zend_Form_Element_Radio('logoFlag');
    $logoFlag->setLabel('Select Logo Image') 
          ->setRequired(false) 
          ->addMultiOptions(array(
             'logo' => 'Logo',
             'not_logo' => 'Not Logo'))
          ->addFilter('StripTags');

   /* $this->addElements(array($shirtSize, 
                            $directorEmail, 
                            $waiverTitle, 
                            $waiverText, 
                            $eventClosedMessage, 
                            $logoFlag
                            )); */

    $subForm1 = new Zend_Dojo_Form_SubForm();

    $subForm1->setAttribs(array(
    'name'   => 'textboxtab',
    'legend' => 'Text Elements',
    'dijitParams' => array(
    'title' => 'Text Elements',
    ),
    ));

    $subForm1->addElements(array($shirtSize, 
                            $directorEmail, 
                            $waiverTitle));

    $subForm2 = new Zend_Dojo_Form_SubForm();

    $subForm2->setAttribs(array(
    'name'   => 'toggletab',
    'legend' => 'Toggle Elements',
    ));

    $subForm2->addElements(array( 
                            $waiverText, 
                            $eventClosedMessage, 
                            $logoFlag
                            ));

$this->addSubForm($subForm1, 'textboxtab')
      ->addSubForm($subForm2, 'editortab');

}
} 
?>

The following in the header.phtml that is included on that page.

<SCRIPT TYPE="text/javascript" SRC="/dojo/dojo.js"></SCRIPT>
<script type="text/javascript">
dojo.require("dojo.parser");
</script>

and the following on the createEvent.phtml page I am trying to view

<?php echo $this->form ;?>
+1  A: 

Difficult to tell exactly what the problem might be without your CSS etc. - but you do seem to have some pretty serious issues in your HTML source, so would try to get them fixed before anything else.

For example, you have a duplicate <html> element inside the <div id="head"> element (including duplicated <head> and <body> elements), and that is bound to lead to somewhat unpredictable behaviour.

Have to say I'm not quite sure how you would have got that kind of output. Are you using layouts? It sort of looks like you may have created the inner <html> element in your view script, and then it's been wrapped in a second one by the layout script. Maybe just check you're definitely only creating the html, head, body elements in one place and see where that gets you to start with...

Will Prescott
Thanks, I figured it out from what you stated. I had something in the layout that was also being created. Both the js files were being called from there causing the error to occur. Thanks
Joe