Back to Top

Create Split Button in admin panel Magento2

Updated 21 February 2024

Create Split Button in admin panel Magento2

Here we learn  how to create Split Button in admin panel Magento2

1# In first step we need to create block file

<?php

namespace Yournamespace\Modulename\Block\Adminhtml\Product;

class CustomActionList extends \Magento\Backend\Block\Widget\Container
{

    /**
     * @param \Magento\Backend\Block\Widget\Context $context
     * @param array $data
     */
    public function __construct(
        \Magento\Backend\Block\Widget\Context $context,
        array $data = []
    ) {
        parent::__construct($context, $data);
    }

    protected function _prepareLayout()
    {
        $addButtonProps = [
            'id' => 'custom_action_list',
            'label' => __('Custom Action List'),
            'class' => 'add',
            'button_class' => '',
            'class_name' => 'Magento\Backend\Block\Widget\Button\SplitButton',
            'options' => $this->_getCustomActionListOptions(),
        ];
        $this->buttonList->add('add_new', $addButtonProps);

        return parent::_prepareLayout();
    }

    /**
     * Retrieve options for 'CustomActionList' split button
     *
     * @return array
     */
    protected function _getCustomActionListOptions()
    {
        /*list of button which you want to add*/
        $splitButtonOptions=[
        'action_1'=>['label'=>__('Action 1'),'onclick'=>'setLocation("ACTION CONTROLLER")'],
        'action_2'=>['label'=>__('Action 2'),'onclick'=>'setLocation("ACTION CONTROLLER")'],
        'action_3'=>['label'=>__('Action 3'),'onclick'=>'setLocation("ACTION CONTROLLER")']
        ];
        /* in above list you can also pass others attribute of buttons*/
        return $splitButtonOptions;
    }
}

2#Now we call this block file in layout page where we want to add this split button

<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <body>
        <referenceContainer name="content">
            <!-- here we call our split button block   -->
            <block class="Yournamespace\Modulename\Block\Adminhtml\Product\CustomActionList" name="admin.product.customsplitbutton"/>
        </referenceContainer>
    </body>
</page>

3# Output as following

split button blog

Thanks ­čÖé

Searching for an experienced
Magento Company ?
Find out More
. . .

Leave a Comment

Your email address will not be published. Required fields are marked*


3 comments

  • gaurav agrawal
    • Abhishek Singh
      • Webkul Support
  • Back to Top

    Message Sent!

    If you have more details or questions, you can reply to the received confirmation email.

    Back to Home