Admin – Tabs with Grids in Admin Extension

adminextensionsgridgrid-serlizationtabs

I have been searching for an example of how to write an extension page with tabs and on each tab is a grid. I don't need a form, just the mass action too. Any one have a link to this? What I'm doing is converting something I have which is under /myext/mycontrol/index/ which I would like to keep and not end up with /admin/mycontrol/index.

An example would be ideal, but if someone can layout the files, for two tabs with grids and the classes, that would be enough I know it. Here is what I have so far for the blocks and controllers.

+-Block
|+-Mycontrol.php
|+-Mycontrol
| |+-Tabs.php
| |+-Action1.php
| |+-Action1
|   |+-Grid.php
+-controllers
 |+-MycontrolController.php

I see the page but no tabs. Here are the file stubs with out the method, as I'm sure that is the issue at hand here.

admin\Mycomp\Myext\Block\Mycontrol.php

<?php
class Mycomp_Myext_Block_Mycontrol extends Mage_Adminhtml_Block_Widget_Grid
    implements Mage_Adminhtml_Block_Widget_Tab_Interface {

    public function __construct() {
        $this->_blockGroup = 'mycontrol';
        $this->_controller = 'media';
        $this->_headerText = Mage::helper('myext')->__('Welcome');
        parent::__construct();
    }


}

admin\Mycomp\Myext\Block\Mycontrol\Tabs.php

<?php
class Mycomp_Myext_Block_Mycontrol_Tabs extends Mage_Adminhtml_Block_Widget_Tabs {
    public function __construct(){
        parent::__construct();
        $this->setId('myext_tabs');
        $this->setTitle(Mage::helper('myext')->__('media controll'));
    }
    protected function _beforeToHtml(){
        $activeSection = $this->_getActiveSection();
        //normal stuff
        return parent::_beforeToHtml();
    }

    protected function _getActiveSection($default = 'orphaned'){
        //normal stuff
        return $activeSection;
    }
}

admin\Mycomp\Myext\Block\Mycontrol\Action1.php

class Mycomp_Myext_Block_Mycontrol_Action1 extends Mage_Adminhtml_Block_Widget_Grid_Container{
    public function __construct(){
        $this->_controller = 'mycontrol_action1';
        $this->_blockGroup = 'mycomp_myext';
        $this->_headerText = Mage::helper('myext')->__('Find Orphaned Images');
        parent::__construct();
        $this->_removeButton('add');
    }

    public function getCreateUrl() {
        return '';
    }

    public function getHeaderCssClass() {
        return '';
    }
}

admin\Mycomp\Myext\Block\Mycontrol\Action1\Grid.php

<?php

class Mycomp_Myext_Block_Mycontrol_Action1_Grid extends Mage_Adminhtml_Block_Widget_Grid {
    public function __construct()
    {
        parent::__construct();
        $this->setId('mycontrol_action1Grid');
        $this->setDefaultSort('prod_id');
        $this->setDefaultDir('ASC');
        $this->setSaveParametersInSession(true);
        $this->setUseAjax(true);
    }

    public function getId(){
        return 'myext_tabs_action1_section_content';
    }

    protected function _prepareCollection(){
        //normal stuff
        return parent::_prepareCollection();
    }

    protected function _prepareColumns(){
        //normal stuff
        return parent::_prepareColumns();
    }

    protected function _prepareMassaction(){
        //normal stuff
        return $this;
    }
}

Something tells me it's just in this order I'm messing up, but for the life of me I can't find one darn example that is not talking about adding tabs to the product page or tabs, edit, and forms. Can some one lay it out?

Update
I have been trying different ways to make this happen. Googling has not help. I do recall some wiki that had an example of on the magento site but I can't find that either. If anyone has the ability, a layout of the files needed and the classes is all I need. A good point in the right direction.

As I understand, I should be close, and tried (I can't seem to find the reference now but something like) $this->add_left() but that was not working either.

Best Answer

You haven't attached your layout xml file. If you have the correct layout set there, then you are almost there. But until you don't see any error messages in your log files your layout is not correctly set. Why to expect errors in the logs? When you want to show a tab and you implement the Mage_Adminhtml_Block_Widget_Tab_Interface, you have to write the interface's methods: getTabLabel, getTabTitle, canShowTab, isHidden. I don't see these methods in your Mycontrol.php block. Also you must have a container for the tabs' content. Have a look at /app/design/adminhtml/default/default/layout/catalog.xml and see how it is implemented there the layout xml at node adminhtml_catalog_product_new. You will see there something like:

<adminhtml_catalog_product_new>
    <update handle="editor"/>
    <reference name="content">
        <block type="adminhtml/catalog_product_edit" name="product_edit"></block>
    </reference>
    <reference name="left">
        <block type="adminhtml/catalog_product_edit_tabs" name="product_tabs"></block>
    </reference>
    <reference name="js">
        <block type="adminhtml/catalog_product_edit_js" template="catalog/product/js.phtml" name="catalog_product_js"></block>
        <block type="core/template" template="catalog/wysiwyg/js.phtml"/>
    </reference>
</adminhtml_catalog_product_new>

What you are interested in is the left reference and the content. First, look at the adminhtml/catalog_product_edit_tabs block class' constructor. You will see:

public function __construct()
{
    parent::__construct();
    $this->setId('product_info_tabs');
    $this->setDestElementId('product_edit_form');
    $this->setTitle(Mage::helper('catalog')->__('Product Information'));
}

with the setDestElementId you set the id of the element which will contain the contents while clicking on a tab. Also in this class you can define a _prepareLayout method and add the tab to the layout:

            $this->addTab('some_name', array(
                'label'     => Mage::helper('your_helper')->__('tab label'),
                'content'   => $this->_translateHtml($this->getLayout()
                    ->createBlock('mycomp/myext_mycontrol')->toHtml()),
            ));

You can add a tab also from the layout xml by using the <action method="addTab">. You can see a couple of examples in catalog.xml. Now that your tab is added, you have to make sure that the container id (what you have specified in the setDestElementId method) does exist. So, go back to the adminhtml_catalog_product_new layout example, see the reference to the content; the block inside should produce the needed id. When these are all set, your tabs will work.

Related Topic