Read More
Read More
Menu Close

    Add HTML note in UI component form field in Magento 2

    Hello Guys!!!

    In this blog, we are going to learn how we can display HTML content notice under a form field in the UI component form in Magento 2.

    To display your required/desired content or notice, you can add the HTML code in the additionalInfo item in the form field as in the following code:

     <field name="store_url">
                <argument name="data" xsi:type="array">
                    <item name="config" xsi:type="array">
                        <item name="dataType" xsi:type="string">text</item>
                        <item name="label" xsi:type="string" translate="true">Store URL</item>
                        <item name="formElement" xsi:type="string">input</item>
                        <item name="dataScope" xsi:type="string">store_url</item>
                        <item name="required" xsi:type="boolean">true</item>
                        <item name="notice" xsi:type="string" translate="true">
                           Enter store URL name. For example: xyzshop
                        </item>
                        <strong><item name="additionalInfo" xsi:type="string"></strong>
                            <em><![CDATA[<span style="color:green">Your store URL will be like:</span> <a href="https://xyzshop.domain.com">https://xyzshop.domain.com</a>]]></em>
                        <strong></item></strong>
                        <item name="validation" xsi:type="array">
                            <item name="required-entry" xsi:type="boolean">true</item>
                        </item>
                    </item>
                </argument>
            </field>

    When you will add the HTML code in your form field, the result will be displayed in the following image:

    download-1-3

    Hope this will be helpful.
    Thanks 🙂

    Searching for an experienced
    Magento 2 Company ?
    Read More
    . . .
    Discuss on Helpdesk

    Leave a Comment

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


    Be the first to comment.

    Back to Top