How to hide/display the annotations on the form

nysbigdave
Kilo Expert

I have been trying to accomplish the following:

 

  • On a field name u_typeofrequestoptions
  • Display an Annotation field depending on the field value.If the field says "other" it will show the annotation field anno1
  • if the field says "faq" it will display anno2   etc...

 

I have been toying with the below script but some how it either displays or doesnt regardless of the selection

 

 

 

function onChange(control, oldValue, newValue, isLoading, isTemplate) {

    if (isLoading || newValue == '') {

          return;

    }

//Type appropriate comment here, and begin script below

      }

var _type = g_form.getValue('u_typeofrequestoptions');

if (_type = 'Other')

  {

  document.getElementById("anno1").style.display="none";

  }

else

  {

  document.getElementById("anno1").style.display="";

  }

alert(document.getElementById("anno1").style.display);

1 ACCEPTED SOLUTION

Thanks mkaufman


the syntax didn't work; however it put me on track.


here is what i used:



function onChange(control, oldValue, newValue, isLoading, isTemplate) {


  if (isLoading || newValue == '') {


  return;


  }


  if (newValue == '1')


  {


    document.getElementById("ano_1").parentNode.style.display="block";


  }


  else


  {


  document.getElementById("ano_1").parentNode.style.display="none";


  }


}


View solution in original post

4 REPLIES 4

Michael Kaufman
Giga Guru

If the onChange field is u_typeofrequestoptions, you can try this out:



function onChange(control, oldValue, newValue, isLoading, isTemplate) {


  if (isLoading || newValue == '') {


  return;


  }


  if (newValue == 'Other') {


  g_form.setDisplay('anno1', false);


  } else {


  g_form.setDisplay('anno1', true);


  }


}


Thanks mkaufman


the syntax didn't work; however it put me on track.


here is what i used:



function onChange(control, oldValue, newValue, isLoading, isTemplate) {


  if (isLoading || newValue == '') {


  return;


  }


  if (newValue == '1')


  {


    document.getElementById("ano_1").parentNode.style.display="block";


  }


  else


  {


  document.getElementById("ano_1").parentNode.style.display="none";


  }


}


How do you give annotations values? For example, how did you define an annotation as ano_1?


nigelharrison
Giga Contributor

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';
}