How to show UI Macro on Change

[Atik]

Hello Everyone,
I have a question regarding the use of a UI Macro in a Catalog Item form. I have a field called "Category" (a Select Box) with options like External, Internal, Existing, Subcontract, etc. Based on the selected value, I want to display some additional information just below this field on both Task and RITM levels.
To achieve this, I created a custom variable "Category Info", embedded the UI Macro inside it, and attached it to the form. The macro is working as expected and displays the relevant message after the form is submitted or refreshed (e.g., when closing a Task or RITM).
However, I'd like this behavior to happen dynamically—when the Category field value changes—without needing to save or reload the form. I'm not sure how to enable that on an OnChange basis category field options..

Code which I written - 

<?xml version="1.0" encoding="utf-8" ?>

<j:jelly trim="false" xmlns:j="jelly:core" xmlns:g="glide" xmlns:j2="null" xmlns:g2="null">

    <g:evaluate var="jvar_field1Value" object="true">

        var tableName = current.getTableName();

        var ritmSysId = '';

        if(tableName == 'sc_req_item'){

        ritmSysId = current.sys_id;

        }else if(tableName == 'sc_task'){

        ritmSysId = current.request_item;

        }else{

        ritmSysId = '';

        }

        var field1Value = '';

        var gr = new GlideRecord('sc_item_option_mtom');

        gr.addQuery('request_item', ritmSysId);

        gr.addQuery('sc_item_option.item_option_new.name', 'category');

        gr.query();

        if (gr.next()) {

        field1Value = gr.sc_item_option.value;

        }

        field1Value;

    </g:evaluate>

    <div class="btn-group btn-group-justified">

        <div class="tabs2_strip">

            <j:if test="${jvar_field1Value == 'ext'}">

                <p style="color:DodgerBlue;"><i> External added.</i></p>

            </j:if>

            <j:if test="${jvar_field1Value == 'int'}">

                <p style="color:DodgerBlue;"><i>Internal added.</i></p>

            </j:if>

            <j:if test="${jvar_field1Value == 'sub_cont'}">

                <p style="color:DodgerBlue;"><i>Sub added.</i></p>

            </j:if>

            <j:if test="${jvar_field1Value == 'exsit'}">

                <p style="color:DodgerBlue;"><i>Exist added</i></p>

            </j:if>

        </div>

    </div>

</j:jelly>

Scenarion for better unserstanding

Category field with option like external, Internal...

- here i wanted to show the info based on options

Thanks in advance,

Atik Bagwan

[Abbas_5]

Hello @Atik,

Please refer to the link below:
https://www.servicenow.com/community/developer-forum/if-condition-in-jelly-script/m-p/2112663#M76958...

If this is helpful, please hit the thumbs up button and accept the correct solution by referring to this solution in future it will be helpful to them.

Thanks & Regards,

Abbas Shaik