I have a dropdown in Magento 2 config setting. Now I want the setting to get displayed only when there are any options available for the dropdown, else it should be not shown. I also want to display a message in this case that "NO options are available currently". How can I implement that without breaking magento2 standards.


2 Answers 2


Go to Admin -> Stores -> Configuration -> Advanced -> Admin -> Admin Base URL

Set Use Custom Admin URL to "Yes" & below it's code


<group id="url" translate="label" type="text" sortOrder="30" showInDefault="1" showInWebsite="0" showInStore="0">
                <label>Admin Base URL</label>
                <field id="use_custom" translate="label" type="select" sortOrder="1" showInDefault="1" showInWebsite="0" showInStore="0" canRestore="1">
                    <label>Use Custom Admin URL</label>
                <field id="custom" translate="label comment" type="text" sortOrder="2" showInDefault="1" showInWebsite="0" showInStore="0" canRestore="1">
                    <label>Custom Admin URL</label>
                        <field id="use_custom">1</field>
                    <comment>Make sure that base URL ends with '/' (slash), e.g. http://yourdomain/magento/</comment>
                <field id="use_custom_path" translate="label" type="select" sortOrder="3" showInDefault="1" showInWebsite="0" showInStore="0" canRestore="1">
                    <label>Use Custom Admin Path</label>
                <field id="custom_path" translate="label comment" type="text" sortOrder="4" showInDefault="1" showInWebsite="0" showInStore="0" canRestore="1">
                    <label>Custom Admin Path</label>
                    <validate>required-entry validate-alphanum</validate>
                        <field id="use_custom_path">1</field>
                    <comment>You will have to sign in after you save your custom admin path.</comment>


    <field id="use_custom_path">1</field>

1 = Yes, 0 = No.

It depends on what select value you set on your dropdown.

  • 1
    NO, this is not what I am expecting, I already know this. Please read the description to understand my requirement. Mar 3, 2017 at 8:08

Found a solution for your problem. You can achieve what you are looking by below.
First you have to add a frontend_class to all the elements you want to hide.
If you have two config fields like below.

<field id="enable_fields" translate="label" type="text" sortOrder="3" showInDefault="1" showInWebsite="1" showInStore="1">
    <label>Select Option</label>
    <frontend_model>NAMESPACE\MODULENAME\Block\SelectOptions</frontend_model> <!-- Our block for adding select box -->

<field id="my_field_one" translate="label" type="text" sortOrder="10" showInDefault="1" showInWebsite="1" showInStore="1">
    <label>Field One</label>

<field id="my_field_two" translate="label" type="text" sortOrder="20" showInDefault="1" showInWebsite="1" showInStore="1">
    <label>Field Two</label>

Here, enable_fields field is the main field which will be the dropdown field as per your requirements. If there are options available for this field, then my_field_one and my_field_two will get displayed.
my_field_one and my_field_two has set frontend_class set to hide-this.
All elements with class name hide-this will be hidden if there is no option available for your first element. Now create a block file,


class SelectOptions extends \Magento\Config\Block\System\Config\Form\Field {

    public function __construct(
    \Magento\Backend\Block\Template\Context $context, array $data = []
    ) {
        parent::__construct($context, $data);

    protected function _getElementHtml(\Magento\Framework\Data\Form\Element\AbstractElement $element) {
        $value = $element->getData('value');


        $options = array( 1 =>'Option One', 2 => 'Option Two'); // Your Select Options
        $name = "groups[general][fields][enable_fields][value]"; // Make sure you are using correct path for your field
        $id = "enable_fields";

        $html = $this->getLayout()->createBlock(

        // ELSE

        $html = '<p>There is no option available.</p>';
        $html .= '<script type="text/javascript">
           require(["jquery"], function ($) {
                $(document).ready(function () {
                        $(this).closest("tr").hide(); // Can also use .remove() to remove the field completely

        // END IF
        return $html;

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.