i'm looking for the way to create Button in Widget
I've done this but it throw an error said "Invalid xml type". So i thing that there's no such thing called xsi:type="button" in magento 2 widget.

<parameter name="btn_test" xsi:type="button"  visible="true">
                <label translate="true">Some button</label>
                <description translate="true">Click this button.</description>


Ah, After my friend suggestion, I've found the way to do this. Still, there is no such thing called xsi:type="button" in magento 2 widget.
So the way to do this is you create a Block to render it.
Okay, so here is how you do this :
In widget file:

<parameter name="button_test" xsi:type="conditions" visible="true"  class="Ves\BaseWidget\Block\Adminhtml\Widget\Form\Field\LoadButton">
                <label translate="true">Button Test</label>
                <description translate="true">Button Test</description>

In Block file:

 * Venustheme
 * This source file is subject to the Venustheme.com license that is
 * available through the world-wide-web at this URL:
 * http://www.venustheme.com/license-agreement.html
 * Do not edit or add to this file if you wish to upgrade this extension to newer
 * version in the future.
 * @category   Venustheme
 * @package    Ves_ImageSlider
 * @copyright  Copyright (c) 2014 Venustheme (http://www.venustheme.com/)
 * @license    http://www.venustheme.com/LICENSE-1.0.html
namespace Ves\BaseWidget\Block\Adminhtml\Widget\Form\Field;

use Magento\Backend\Block\Template;
use Magento\Framework\Data\Form\Element\AbstractElement;
use Magento\Framework\Data\Form\Element\Renderer\RendererInterface;
use Magento\Framework\Escaper;

class LoadButton extends Template implements RendererInterface

     * @var \Magento\Framework\Data\Form\Element\CollectionFactory
    protected $_factoryCollection;

     * @var \Magento\Framework\Data\Form\Element\Factory
    protected $_factoryElement;

     * @var \Magento\Framework\Escaper
    protected $_escaper;

     * @var \Magento\Framework\View\LayoutInterface
    protected $_layout;

     * Adminhtml data
     * @var \Magento\Backend\Helper\Data
    protected $_backendData = null;

    protected $element_id = "";

     * @param \Magento\Backend\Block\Template\Context                $context
     * @param \Magento\Framework\Data\Form\Element\Factory           $factoryElement
     * @param \Magento\Framework\Data\Form\Element\CollectionFactory $factoryCollection
     * @param Escaper                                                $escaper
     * @param \Magento\Cms\Model\Wysiwyg\Config                      $wysiwygConfig
     * @param \Magento\Framework\View\LayoutInterface                $layout
     * @param \Magento\Backend\Helper\Data                           $backendData
    public function __construct(
        \Magento\Backend\Block\Template\Context $context,
        \Magento\Framework\Data\Form\Element\Factory $factoryElement,
        \Magento\Framework\Data\Form\Element\CollectionFactory $factoryCollection,
        \Magento\Cms\Model\Wysiwyg\Config $wysiwygConfig,
        /*\Magento\Framework\View\LayoutInterface $layout,*/
        \Magento\Backend\Helper\Data $backendData
        $this->_factoryElement = $factoryElement;
        $this->_factoryCollection = $factoryCollection;
        /*$this->_layout = $layout;*/
        $this->_backendData = $backendData;
        $this->_wysiwygConfig = $wysiwygConfig;
    public function render(AbstractElement $element){

        $html = '';
        $class = '';
            $class = 'required-entry';

        $html .= '<div class="admin__field field field-options_'.$element->getId().'  with-note">';
        $html .= $element->getLabelHtml();

        $html .= '<div class="admin__field-control control">';

        $html .= $this->_layout->createBlock(
                'data' => [
                    'label' => __('Test Button'),
                    'type' => 'button',
                    'class' => 'action-wysiwyg',

        $html .= '</div>';
        $html .= '</div>';

        return $html;

So that'll render the button through Block file.
But right now, i've to looking for how to onclick it, so it can throw a popup.
Thanks you all for reading :)

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.