Show a warning message on a Product Tab on the Product Edit Page in Magento 2

Mohd. Faizan
Published: January 19, 2023

Sometimes we might have to show a warning message on a product tab on the product edit page in Magento 2. Let’s see how we can do that.

First, create ‘di.xml’ in location Webkul/ShowWarning/etc/adminhtml/

<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:ObjectManager/etc/config.xsd">
    <virtualType name="Magento\Catalog\Ui\DataProvider\Product\Form\Modifier\Pool">
        <arguments>
            <argument name="modifiers" xsi:type="array">
                <item name="advancedCustomOptions" xsi:type="array">
                    <item name="class" xsi:type="string">Webkul\ShowWarning\Ui\DataProvider\ProductForm</item>
                    <item name="sortOrder" xsi:type="number">20</item>
                </item>
            </argument>
        </arguments>
    </virtualType>
</config>

Then create ‘CustomOptions.php’ in location Webkul/ShowWarning/Ui/DataProvider/

<?php
namespace Webkul\ShowWarning\Ui\DataProvider;
 
use Magento\Catalog\Ui\DataProvider\Product\Form\Modifier\AbstractModifier;
use Magento\Catalog\Model\Locator\LocatorInterface;
use Magento\Framework\App\RequestInterface;
use Magento\Framework\View\LayoutFactory;
use Magento\Ui\Component\Container;
 
class CustomOptions extends AbstractModifier
{
    /**
     * @var LocatorInterface
     */
    protected $locator;
 
    /**
     * @var RequestInterface
     */
    protected $request;
 
    /**
     * @var LayoutFactory
     */
    private $layoutFactory;
 
    public function __construct(
        LocatorInterface $locator,
        RequestInterface $request,
        LayoutFactory $layoutFactory
    ) {
        $this->locator = $locator;
        $this->request = $request;
        $this->layoutFactory = $layoutFactory;
    }
 
    public function modifyMeta(array $meta)
    {
       $meta["custom_options"] = [
          'children' => [
             'price_drop_warning' => $this->getPriceDropWarning()
           ]
       ];
       return $meta;
    }
 
    /**
     * {@inheritdoc}
     */
    public function modifyData(array $data)
    {
        return $data;
    }
    public function getPriceDropWarning()
    {
        return [
            'arguments' => [
                'data' => [
                    'config' => [
                        'componentType' => 'container',
                        'component' => 'Magento_Ui/js/form/components/html',
                        'additionalClasses' => 'message message-warning',
                        'content' => __('Your Warning Message'),
                    ],
                ],
            ]
        ];
    }
}

Here we have shown the warning message on the Custom Options tab.

Note – Here the ‘additionalClasses’ key is responsible for the warning template of the given content, you can also change the content template to error format, use ‘message message-error’ as the value of ‘additionalClasses’ key.

Before showing warning

Before showing warning

After showing warning

After showing warning

Source: webkul.com