Show/Hide Annotations in a "Form Section" on a certain view

[veena_kvkk88]

Hi all,

This should be easy but am unable to figure out. I want show/hide annotations based on a choice field. I was able to do this using onChange() client script and by having element id's for each annotation.

function onChange(control, oldValue, newValue, isLoading, isTemplate) {
   if (isLoading) {
   return;
   }
   if(getView() == 'sample_view'){
   if (newValue == "First choice"){
   document.getElementById("anno1").parentNode.style.display="none";
   document.getElementById("anno2").parentNode.style.display="none";
   document.getElementById("anno3").parentNode.style.display="block";
   }
   else if(newValue == "Second choice"){
   document.getElementById("anno1").parentNode.style.display="block";
   document.getElementById("anno2").parentNode.style.display="block";
   document.getElementById("anno3").parentNode.style.display="none";
   }
   else if(newValue == ""){
   document.getElementById("anno1").parentNode.style.display="none";
   document.getElementById("anno2").parentNode.style.display="none";
   document.getElementById("anno3").parentNode.style.display="none";
   }
   }
}

This was working fine when I had these annotations on the main form in the "Sample View". Now I have annotations in a section on the form. When I use the same script, it is unable to locate the elements. Do I have to specify what section these are on? If so, how do I do that? Please help.

[veena_kvkk88 · Accepted solution]

My bad!! I missed closing the quotes for one of the annotation id's. I thought there was an issue with the script. I feel stupid! Thanks for trying though

[nigelharrison]

Just went through the pain of getting this to work and our developer fixed the following.

Created a UI policy against the field you want to show the annotation against. In this case, a 'Yes/No' field, annotation only to show on YES and hide when none or NO.

UI Policy Script

execute if true

function onCondition() {
var refs3 = document.getElementsByClassName("annotation-wrapper");
refs3[24].style.display = 'block';
}

execute if false

function onCondition() {
var refs3 = document.getElementsByClassName("annotation-wrapper");
refs3[24].style.display = 'none';

}

This annotation is the 25th annotation, in 'form design' you count them 0-24.

The obvious problem to be aware of.
If annotations are added or removed above this annotation then the script will start hiding the new 25th annotation.

So we amended and added the label feature in the annotation to pick up specific annotation, no need to number them.

In the annotation you need to a a lablel.
<div id="annotation_label"> Annotation Text Goes Here </div>

UI Policy Script

execute if true

function onCondition() {
var refs3 = document.getElementById("annotation_label");
refs3.style.display = 'block';
refs3.parentElement.style.display = 'block';
}

execute if false

function onCondition() {
var refs3 = document.getElementById("annotation_label");
refs3.style.display = 'none';
refs3.parentElement.style.display = 'none';
}