Admin tab content renders on the left

Question

I'm learning Magento Admin - the final frontier. I want to add tabs on the left which display their content on the right. So far I have 2 tabs - the first renders the content in the tabs and the second doesn't work.

I suppose I have to add some empty form container on the right and somehow link the tab contents to that container. But I don't know how exactly to do that. Below is a screenshot of what I have so far:

enter image description here

And here's the file structure:

enter image description here

CODE:

config.xml:

<?xml version="1.0" encoding="UTF-8" ?>
<config>
<modules>
 <Swiner_Hog>
 <version>0.1.0</version>
 </Swiner_Hog>
</modules>
<global>
 <models>
 <swiner_hog>
 <class>Swiner_Hog_Model</class>
 <resourceModel>swiner_hog_resource</resourceModel>
 </swiner_hog>
 <swiner_hog_resource>
 <class>Swiner_Hog_Model_Resource</class>
 <entities>
 <garbage>
 <table>swine_table</table>
 </garbage>
 </entities>
 </swiner_hog_resource>
 </models>
 <blocks>
 <swiner_hog>
 <class>Swiner_Hog_Block</class>
 </swiner_hog>
 </blocks>
 <helpers>
 <swiner_hog>
 <class>Swiner_Hog_Helper</class>
 </swiner_hog>
 </helpers>
 <resources>
 <swiner_hog_setup>
 <setup>
 <module>Swiner_Hog</module>
 </setup>
 </swiner_hog_setup>
 </resources>
</global>
<admin>
 <routers>
 <adminhtml>
 <args>
 <modules>
 <swiner_hog after="Mage_Adminhtml">Swiner_Hog_Adminhtml</swiner_hog>
 </modules>
 </args>
 </adminhtml>
 </routers>
</admin>
<adminhtml>
 <layout>
 <updates>
 <swiner_hog>
 <file>swiner/hog.xml</file>
 </swiner_hog>
 </updates>
 </layout>
</adminhtml>

SwineController.php:

<?php
class Swiner_Hog_Adminhtml_SwineController extends Mage_Adminhtml_Controller_Action
{
 public function tabsIndexAction()
{
 $tabs = $this->getLayout()->createBlock('swiner_hog/adminhtml_tabs');
 $this->loadLayout()->_addLeft($tabs);
// Not sure what type of block to create here ???
// $block = $this->getLayout()->createBlock('swiner_hog/adminhtml_???');
// $this->_addContent($block);
 $this->renderLayout();
}
public function saveAction() 
{
.... code ....
}
}

Tabs.php:

<?php
class Swiner_Hog_Block_Adminhtml_Tabs extends Mage_Adminhtml_Block_Widget_Tabs
{
public function __construct()
{
 parent::__construct();
 $this->setId('tabs_block');
 $this->setDestElementId('content_form');
 $this->setTitle($this->__('Tabs Information'));
}
protected function _beforeToHtml()
{
 //This will get all existing tabs which is Default in Magento
 $this->parent = parent::_prepareLayout();
 $this->addTab('first', array(
 'label' => $this->__('Change details'),
 'content' => $this->getLayout()->createBlock('swiner_hog/adminhtml_tabs_first')->toHtml(),
 'active' => true,
 ));
 $this->parent = parent::_prepareLayout();
 $this->addTab('second', array(
 'label' => $this->__('Change something'),
 'content' => $this->getLayout()->createBlock('swiner_hog/adminhtml_tabs_second')->toHtml(),
 'active' => false,
 ));
 return parent::_beforeToHtml();
}
}

First.php:

<?php
class Swiner_Hog_Block_Adminhtml_Tabs_First extends Mage_Adminhtml_Block_Widget_Form
{
protected function _prepareForm()
{
 if (Mage::registry('current_swine'))
 {
 $data = Mage::registry('current_swine')->getData();
 } else {
 $data = array();
 }
 // SET POST
 $form = new Varien_Data_Form(array(
 'id' => 'content_form',
 'action' => $this->getUrl('*/*/save', array('id' => $this->getRequest()->getParam('id'))),
 'method' => 'post',
 'enctype' => 'multipart/form-data'
 )
 );
 $this->setForm($form);
 $fieldset = $form->addFieldset('general_form', array(
 'legend' => $this->__('First Form')
 ));
 $fieldset->addField('name', 'text', array(
 'label' => $this->__('Name'),
 'class' => 'required entry',
 'required' => true,
 'name' => 'name',
 ));
 $fieldset->addField('description', 'text', array(
 'label' => $this->__('Description'),
 'class' => 'required entry',
 'required' => true,
 'name' => 'description',
 ));
 $form->setUseContainer(true);
 $form->setValues($data);
 return parent::_prepareForm();
}
}

Second.php:

<?php
class Swiner_Hog_Block_Adminhtml_Tabs_Second extends Mage_Adminhtml_Block_Widget_Form
{
protected function _prepareForm()
{
 $form = new Varien_Data_Form(array(
 'id' => 'content_form',
 'enctype' => 'multipart/form-data'
 )
 );
 $fieldset = $form->addFieldset('general_form', array(
 'legend' => $this->__('Second Form')
 ));
 return parent::_prepareForm();
}
}

I don't have anything in the layout file(hog.xml). I'm sure that using xml for adding tabs is easier but I want to do this the other way.

• Qaisar Satti: what are you trying to do are you adding the form?
• Bruno: @Qaisar Satti, I want to render the tab contents to appear on the right. Each of the 2 tabs has a block assigned to it in _beforeToHtml() in Tabs.php. In tabsIndexAction() I haven't added any kind of block to the page content. Because I don't know what should go there and how it should be linked to the tabs' blocks.

Answer 1

I got it! After reading this tutorial for the 10th time maybe.

I made 2 major mistakes. My approach was wrong right from the beginning. I had to start from form container, then form and THEN tabs. Not the other way around. And I had an error in the controller.

Anyway, here's the working solution along with a screenshot:

screenshot

CODE:

SwineController.php:

class Swiner_Hog_Adminhtml_SwineController extends Mage_Adminhtml_Controller_Action
{
public function tabsIndexAction()
{
 $this->loadLayout();
 $block = $this->getLayout()->createBlock('swiner_hog/adminhtml_tabs_container');
 $this->_addContent($block);
 $tabs = $this->getLayout()->createBlock('swiner_hog/adminhtml_tabs_container_tabs');
 $this->_addLeft($tabs);
 $this->renderLayout();
}
 .............
}

Container.php:

<?php
class Swiner_Hog_Block_Adminhtml_Tabs_Container extends Mage_Adminhtml_Block_Widget_Form_Container
{
public function __construct()
{
 parent::__construct();
 $this->_objectId = 'id';
 $this->_blockGroup = 'swiner_hog';
 $this->_controller = 'adminhtml_tabs';
 $this->_mode = 'container';
}
public function getHeaderText()
{
 return $this->__('Swine Container');
}
}

Form.php:

<?php
class Swiner_Hog_Block_Adminhtml_Tabs_Container_Form extends Mage_Adminhtml_Block_Widget_Form
{
protected function _prepareForm()
{
 $form = new Varien_Data_Form(array(
 'id' => 'content_form',
 'enctype' => 'multipart/form-data'
 )
 );
 // Without these 2 settings, the form will render on the left. So we're setting this to use the container.
 $form->setUseContainer(true);
 $this->setForm($form);
 return parent::_prepareForm();
}
}

Tabs.php:

<?php
class Swiner_Hog_Block_Adminhtml_Tabs_Container_Tabs extends Mage_Adminhtml_Block_Widget_Tabs
{
public function __construct()
{
 parent::__construct();
 $this->setId('form_tabs');
 $this->setDestElementId('content_form');
 $this->setTitle($this->__('Tabs Information'));
}
protected function _beforeToHtml()
{
 //This will get all existing tabs which is Default in Magento
 $this->parent = parent::_prepareLayout();
 $this->addTab('first', array(
 'label' => $this->__('Change details'),
 'content' => $this->getLayout()->createBlock('swiner_hog/adminhtml_tabs_container_tab_first')->toHtml(),
 'active' => true,
 ));
 $this->parent = parent::_prepareLayout();
 $this->addTab('second', array(
 'label' => $this->__('Something else'),
 'content' => $this->getLayout()->createBlock('swiner_hog/adminhtml_tabs_container_tab_second')->toHtml(),
 'active' => false,
 ));
 return parent::_beforeToHtml();
}
}

First.php:

<?php
class Swiner_Hog_Block_Adminhtml_Tabs_Container_Tab_First extends Mage_Adminhtml_Block_Widget_Form
{
protected function _prepareForm()
{
 if (Mage::registry('current_swine'))
 {
 $data = Mage::registry('current_swine')->getData();
 } else {
 $data = array();
 }
 // SET POST
 $form = new Varien_Data_Form(array(
 'id' => 'edit_form',
 'action' => $this->getUrl('*/*/save', array('id' => $this->getRequest()->getParam('id'))),
 'method' => 'post',
 'enctype' => 'multipart/form-data'
 )
 );
 $this->setForm($form);
 $fieldset = $form->addFieldset('general_form', array(
 'legend' => $this->__('General Setup')
 ));
 $fieldset->addField('name', 'text', array(
 'label' => $this->__('Name'),
 'class' => 'required entry',
 'required' => true,
 'name' => 'name',
 ));
 $fieldset->addField('description', 'text', array(
 'label' => $this->__('Description'),
 'class' => 'required entry',
 'required' => true,
 'name' => 'description',
 ));
 $form->setUseContainer(true);
 $form->setValues($data);
 return parent::_prepareForm();
}
}

Second.php:

<?php
class Swiner_Hog_Block_Adminhtml_Tabs_Container_Tab_Second extends Mage_Adminhtml_Block_Widget_Form
{
protected function _prepareForm()
{
 $form = new Varien_Data_Form(array(
 'id' => 'edit_form',
 'method' => 'post',
 'enctype' => 'multipart/form-data'
 )
 );
 $this->setForm($form);
 $fieldset = $form->addFieldset('general_form', array(
 'legend' => $this->__('Second Tab')
 ));
 $fieldset->addField('name', 'text', array(
 'label' => $this->__('Name'),
 'class' => 'required entry',
 'required' => true,
 'name' => 'name',
 ));
 $form->setUseContainer(true);
 return parent::_prepareForm();
}
}