Hiding a UI Macro based on Field Data

[ewok]

I have created the following UI Macro that displays on a particular field in a form. The macro works great and provides the custom link to a 3rd party website and appends the field data onto the button link. However I want to hide the button if the data in a specific field is null. I have tried a few things based on some searching such as a Jelly If statement and even some if statements in the script section of this UI Macro. However none have proved to be successful. Any Suggestions? I am running Kingston Patch 4 currently. 

---Current UI Macro---

<?xml version="1.0" encoding="utf-8" ?>
<j:jelly trim="false" xmlns:j="jelly:core" xmlns:g="glide" xmlns:j2="null" xmlns:g2="null">
<j:set var="jvar_n" value="ip_rep_${ref}"/>
<span id="${jvar_n}" onclick="ip_rep('${ref}')" title="IP Reputation" alt="IP Reputation" tabindex="0" class="btn btn-default icon-search">
<span class="sr-only">IP Reputation</span>
</span>
<script>
function ip_rep(reference){
window.open('https://www.talosintelligence.com/reputation_center/lookup?search=' + encodeURI(g_form.getValue('u_source_ip_s')));
}
</script>
</j:jelly>

----Jelly IF-----

<j:if test="${u_source_ip_s != null}">
<j:set var="jvar_n" value="ip_rep_${ref}"/>
<span id="${jvar_n}" onclick="ip_rep('${ref}')" title="IP Reputation" alt="IP Reputation" tabindex="0" class="btn btn-default icon-search">
<span class="sr-only">IP Reputation</span>
</span>
</j:if>

----Script IF----

function ip_rep(reference){
if (g_form.getValue('u_source_ip_s') != null){
window.open('https://www.talosintelligence.com/reputation_center/lookup?search=' + encodeURI(g_form.getValue('u_source_ip_s')));
}
}

[Ankit P]

Check another OOB UI Macro task_show_ci_map for more clarity.

This is what you need: Modify field names as per your requirement.

// show link if populated, hide if not
//
function onChange_cmdb_ci_bsm(element, original, changed, loading) {
  var visibility = 'hidden';
   if (changed.length > 0)
    visibility = 'visible';

  var e = gel('${jvar_n}');
  e.style.visibility= visibility;
}

[ewok]

Yeah this function is passing in the changed variable when it is called. I need a way to reference the current record. 

I have tried referencing my current record with current, with $[ref] and ${ref} as some other pages have mentioned. None of these have worked for me

=================1=============

if (${ref}.u_source_ip_s != null )
visibility = 'visible'

================2==============

if ($[ref].u_source_ip_s != null )
visibility = 'visible'

============3=================

if (current.u_source_ip_s != null )
visibility = 'visible'

I have also tried to use the alert(); function to print out my variables but it only seems to be able to print out variables i define and set. 

[Ankit P · Accepted solution]

Hi,

I have tested g_form works fine in UI Macro.

Try thisalong with previous onChange.

var sysID = g_form.getValue('u_source_ip_s');

if(!sysID){

visibility = 'hidden';

}

[ewok]

Thanks I finally got things working. Took me a while to figure out the onChange you were referring to. But once I added that in the span and called the function I created for onChange and passed it the reference values things worked at expected. Here is my complete UI Macro for those who have a similar problem. 

<?xml version="1.0" encoding="utf-8" ?>
<j:jelly trim="false" xmlns:j="jelly:core" xmlns:g="glide" xmlns:j2="null" xmlns:g2="null">
<j:set var="jvar_n" value="ip_rep_src_ip_${ref}" />
<span id="${jvar_n}" onChange="onChange('${ref}')" onclick="ip_rep_src_ip('${ref}')" title="IP Reputation" alt="IP Reputation" tabindex="0" class="btn btn-default icon-search">
<span class="sr-only">IP Reputation</span>
</span>

<script>
function onChange(element, original, changed, loading) {
var visibility = 'visible';
var sysID = g_form.getValue('u_source_ip_s');
if (!sysID)
visibility = 'hidden';

var e = gel('${jvar_n}');
e.style.visibility= visibility;
}


function ip_rep_src_ip(reference){
window.open('https://www.talosintelligence.com/reputation_center/lookup?search=' + encodeURI(g_form.getValue('u_source_ip_s')));
}
</script>
</j:jelly>

[Piotr Ba_amut1]

Good job! worked for me as well. I've used that for showing a maintenance schedule for CIs which should have their maintenance schedule defined.