Event change with ajax

Question

I need a field, when a value x is set, to render two other fields. With my current method, I can only render a single field. How do I select one?

<h:selectOneMenu id="regional" styleClass="form-control bf-no-message bf-required"
value="#{relatorioPendenciaDocumentoBean.filtro.regional}" converter="entityConverter">
<f:selectItem itemValue="" itemLabel=""/>
<f:selectItems value="#{relatorioPendenciaDocumentoBean.regionais}" var="re" itemValue="#{re}" itemLabel="#{re.label}" />
<f:ajax event="change" render="campi" listener="#{relatorioPendenciaDocumentoBean.findCampusList}" />

In this ajax, I need it to render the "course" field, as well as the "campi"

Answer 1

As I don’t know exactly what technology you are using, I will share a solution I adopted using only ajax.

$('idElemento'). change(Function (){

var valor = $( this ).val();
if(valor == valorASerComparado){

  $('#id').hide();
  $('#id').show();

If show/Hide doesn’t work, you can change the CSS properties

 $("#id").css("display", "none");

 $("#id").css("display", "block");

} })