5

My module has 2 tabs. In one, there is a text field for an API Key. In the other, a select field gets populated based off an HTTP request that is made with the API Key. I have all this working fine. However, if the user has not entered an API key, I'd like to display a message to them about the need to do so, rather than showing the empty Options field.

Screen 1 - API Key

enter image description here


Screen 2 - Options

enter image description here


I'm hoping there is a way to do this purely through system.xml. I'd also be ok with just injecting some custom JavaScript onto the page, but I'd need instructions on how to do that as well.

3

It is also possible in UI component with the <switcherConfig>. You can refer magento sales rule module form UI component file. I had a same requirement and I did it by using following code.

<field name="allow_to_proceed" sortOrder="10" formElement="checkbox">
<argument name="data" xsi:type="array">
    <item name="config" xsi:type="array">
        <item name="source" xsi:type="string">page</item>
        <item name="default" xsi:type="number">0</item>
    </item>
</argument>
<settings>
    <dataType>boolean</dataType>
    <label translate="true">Allow Proceed to Checkout</label>
    <dataScope>allow_to_proceed</dataScope>
    <switcherConfig>
        <rules>
            <rule name="0">
                <value>1</value>
                <actions>
                    <action name="0">
                        <target>custom_module_rules_form.custom_module_rules_form.actions.skip_other_rules</target>
                        <callback>show</callback>
                    </action>
                    <action name="1">
                        <target>custom_module_rules_form.custom_module_rules_form.actions.remove_discount</target>
                        <callback>show</callback>
                    </action>
                </actions>
            </rule>
            <rule name="1">
                <value>0</value>
                <actions>
                    <action name="0">
                        <target>custom_module_rules_form.custom_module_rules_form.actions.skip_other_rules</target>
                        <callback>hide</callback>
                    </action>
                    <action name="1">
                        <target>custom_module_rules_form.custom_module_rules_form.actions.remove_discount</target>
                        <callback>hide</callback>
                    </action>
                </actions>
            </rule>
        </rules>
        <enabled>true</enabled>
    </switcherConfig>        
</settings>
<formElements>
    <checkbox>
        <settings>
            <valueMap>
                <map name="false" xsi:type="number">0</map>
                <map name="true" xsi:type="number">1</map>
            </valueMap>
            <prefer>toggle</prefer>
        </settings>
    </checkbox>
</formElements>

Here <target> is your form_datacomponent_name.section_name.field_name .

1

You don't need to do anything extra default ui component give this functionality. you can use this code & change field, form namespace vendor_module_form, fieldset general. That's all!!

<field name="is_enable">
        <argument name="data" xsi:type="array">
            <item name="config" xsi:type="array">
                <item name="label" xsi:type="string" translate="true">Is Enable</item>
                <item name="visible" xsi:type="boolean">true</item>
                <item name="dataType" xsi:type="string">boolean</item>
                <item name="formElement" xsi:type="string">checkbox</item>
                <item name="prefer" xsi:type="string">toggle</item>
                <item name="valueMap" xsi:type="array">
                    <item name="true" xsi:type="number">1</item>
                    <item name="false" xsi:type="number">0</item>
                </item>
                <item name="default" xsi:type="number">0</item>
                <item name="source" xsi:type="string">from_general</item>
                <item name="dataScope" xsi:type="string">is_enable</item>
                <item name="notice" xsi:type="string" translate="true">
                    Here your message/comment go.
                </item>
                <item name="switcherConfig" xsi:type="array">
                    <item name="enabled" xsi:type="boolean">true</item>
                    <item name="rules" xsi:type="array">
                        <item name="0" xsi:type="array">
                            <item name="value" xsi:type="number">0</item>
                            <item name="actions" xsi:type="array">
                                <item name="0" xsi:type="array">
                                    <item name="target" xsi:type="string">vendor_module_form.vendor_module_form.general.field</item>
                                    <item name="callback" xsi:type="string">show</item>
                                </item>
                            </item>
                        </item>
                        <item name="1" xsi:type="array">
                            <item name="value" xsi:type="number">1</item>
                            <item name="actions" xsi:type="array">
                                <item name="0" xsi:type="array">
                                    <item name="target" xsi:type="string">vendor_module_form.vendor_module_form.general.field</item>
                                    <item name="callback" xsi:type="string">hide</item>
                                </item>
                            </item>
                        </item>
                    </item>
                </item>
            </item>
        </argument>
    </field>  

Your Answer

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

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