Doubt How to perform onChange on two Selects

Asked

Viewed 57 times

1

I would like to know how to perform an onChange in the two selects I have in my form follow the selects:

<div class="row">
  <div class="col-md-12">
    <div class="form-group ${status.error ? has-error : '' }">
      <label for="listaContato" class="control-label"><spring:message
          code="ca_tipo_contato" /></label> <label
        class="listaContato control-label ${status.error ? has-error : ''}">
        <form:errors path="tipoContato" element="label" />
      </label>

      <form:select path="tipoContato" id="listaContato"
        data-placeholder="Contato" cssClass="form-control"
        cssStyle="width:100%;">
        <form:option value=""></form:option>
        <form:options items="${listaContato}"
          itemLabel="tipoContato" itemValue="id" />
      </form:select>
    </div>
  </div>
</div>
<div class="row">
  <div class="col-md-12">
    <div class="form-group ${status.error ? has-error : '' }">
      <label for="listaDescricaoContato" class="control-label"><spring:message
          code="ca_descricao_contato" /></label> <label
        class="listaDescricaoContato control-label ${status.error ? has-error : ''}">
        <form:errors path="tipoDescricaoContato" element="label" />
      </label>

      <form:select path="tipoDescricaoContato"
        id="tipoDescricaoContato"
        data-placeholder="Descrição Contato"
        cssClass="form-control" cssStyle="width:100%;">
        <form:option value=""></form:option>
        <form:options items="${listaDescricaoContato}"
          itemLabel="tipoDescricaoContato"
          itemValue="id" />
      </form:select>
    </div>
  </div>

Typodel depends on Typoconthate as it would to perform this onChange.

javascript java

  • Wesley, explain the purpose of your code, that is, how this screen should behave. The way your question is it’s not to know what you want.

  • The best and simplest is putting an onchange on each one.

  • just as @Fucking Pra said, all you have to do is add an attribute this way in each select: onchange="nomedafuncao()" where the function attached to the value of the attribute will perform at the moment the user changes the option of the select in question. So just declare a javascript function in your file . js and assign it to your select through this way.

1 answer

0


Good staff I appreciate more I managed to settle in the following way:

   $( "#nomeSubStatusAnomalia" ).prop( "disabled", true );

            $("#nomeStatus").change(function () {
                    var StatusAnomalia = $("#nomeStatus").val();
                jQuery.ajax({
                        contentType : 'application/json; charset=utf-8',
                        type : 'GET',
                        url : '/cct/anomalia/changeSubStatusAnomalia/'+ StatusAnomalia,

                            beforeSend : function(xhr) {

                                xhr.setRequestHeader("Accept", "application/json");
                                xhr.setRequestHeader("Content-Type", "application/json");
                                xhr.setRequestHeader(header, token);
                            },

                            success : function(response) {

                                console.log(response);


                                $.each(response, function(index, value){

                                    $("#nomeSubStatusAnomalia").append(

                                         '<option value='+ value.nomeSubStatusAnomalia +'>'+ value.nomeSubStatusAnomalia +'</option>'

                                    );

                               });

                            $( "#nomeSubStatusAnomalia" ).prop( "disabled", false );

                        },
                        error : function(response, textStatus, errorThrown) {

                        }
                });

        });

I set up this ajax to meet the needs of my form.

Browser other questions tagged javascript java

You are not signed in. Login or sign up in order to post.