Magento 2 – How to Add Multi-Tab Forms in Admin

adminformsmagento2magento2.2magento2.3

With singleton table CRUD I successfully created a form I want to spread it to multi tabs.

Best Answer

Reference Example of adding demo tab and demo field in Customer form in admin you can follow the same for your form

  1. Create a file Webkul/CustomerEdit/view/adminhtml/layout/customer_index_edit.xml.

    <?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" layout="admin-2columns-left" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
<body>
    <referenceBlock name="customer_form">
         <block class="Webkul\CustomerEdit\Block\Adminhtml\Customer\Edit\Tabs" name="custom_edit_tab_view" />
    </referenceBlock>    
</body>
</page>

  2. Now create the Tabs.php in Webkul/CustomerEdit/Block/Adminhtml/Customer/Edit as we defined in customer_index_edit.xml file

     <?php
 namespace Webkul\CustomerEdit\Block\Adminhtml\Customer\Edit;

 use Magento\Customer\Controller\RegistryConstants;
 use Magento\Ui\Component\Layout\Tabs\TabInterface;
 use Magento\Backend\Block\Widget\Form;
 use Magento\Backend\Block\Widget\Form\Generic;
/**
* Customer account form block
*/
class Tabs extends Generic implements TabInterface
{
  /**
  * @var \Magento\Store\Model\System\Store
  */
 protected $_systemStore;
 /**
  * Core registry
  *
  * @var \Magento\Framework\Registry
  */
 protected $_coreRegistry;

 /**
  * @param \Magento\Backend\Block\Template\Context $context
  * @param \Magento\Framework\Registry $registry
  * @param array $data
  */
 public function __construct(
     \Magento\Backend\Block\Template\Context $context,
     \Magento\Framework\Registry $registry,
     \Magento\Framework\Data\FormFactory $formFactory,
     \Magento\Store\Model\System\Store $systemStore,

     array $data = []
 ) {
     $this->_coreRegistry = $registry;
     $this->_systemStore = $systemStore;
     parent::__construct($context, $registry, $formFactory, $data);
 }

 /**
  * @return string|null
  */
 public function getCustomerId()
 {
     return $this->_coreRegistry->registry(RegistryConstants::CURRENT_CUSTOMER_ID);
 }

 /**
  * @return \Magento\Framework\Phrase
  */
 public function getTabLabel()
 {
     return __('Demo Tab');
 }

 /**
  * @return \Magento\Framework\Phrase
  */
 public function getTabTitle()
 {
     return __('Demo Tab');
 }

 /**
  * @return bool
  */
 public function canShowTab()
 {
     if ($this->getCustomerId()) {
         return true;
     }
     return false;
 }

 /**
  * @return bool
  */
 public function isHidden()
 {
    if ($this->getCustomerId()) {
         return false;
     }
     return true;
 }

 /**
  * Tab class getter
  *
  * @return string
  */
 public function getTabClass()
 {
     return '';
 }

 /**
  * Return URL link to Tab content
  *
  * @return string
  */
 public function getTabUrl()
 {
     return '';
 }

 /**
  * Tab should be loaded trough Ajax call
  *
  * @return bool
  */
 public function isAjaxLoaded()
 {
     return false;
 }
 public function initForm()
 {
     if (!$this->canShowTab()) {
         return $this;
     }
     /**@var \Magento\Framework\Data\Form $form */
     $form = $this->_formFactory->create();
     $form->setHtmlIdPrefix('myform_');

     $fieldset = $form->addFieldset('base_fieldset', ['legend' => __('Fields Information')]);

         $fieldset->addField(
             'demo_field',
             'text',
             [
                 'name' => 'demo_field',
                 'data-form-part' => $this->getData('target_form'),
                 'label' => __('Demo Field in Customer Section'),
                 'title' => __('Demo Field in Customer Section'),
                 'value' => $rowcom,
             ]
         );
     $this->setForm($form);
     return $this;
 }
 /**
  * @return string
  */
 protected function _toHtml()
 {
     if ($this->canShowTab()) {
         $this->initForm();
         return parent::_toHtml();
     } else {
         return '';
     }
 }
 /**
  * Prepare the layout.
  *
  * @return $this
  */
// You can call other Block also by using this function if you want to add phtml file.
public function getFormHtml() 
 {
     $html = parent::getFormHtml();
     $html .= $this->getLayout()->createBlock(
         'Webkul\CustomerEdit\Block\Adminhtml\Customer\Edit\Tab\EdditionalBlock'
     )->toHtml();
     return $html;
 }
}

I hope this will help

Related Topic