Blur event with next select field

Asked

Viewed 159 times

-1

I have a form with all fields disabled except the first one. When filling the first field, if the value exists in the database all fields must be activated. I did this using the jquery Blur event. The problem is that the second field is a select, when I click on that field they are not activated, but if you click on the third field that is an input=text it works. I can’t reverse the order of the fields.

Follows the code:

$(function(){ 
				              
    $("input[name='txt_dd_n_fogo']").blur( function(){  

    var txt_dd_n_fogo = $("input[name='txt_dd_n_fogo']").val();

    $.post('posicoes/function.php',{txt_dd_n_fogo: txt_dd_n_fogo},function(data){
                          
    if( data!='Não existe ainda!' ){ 
       alert(data);

       $("input[name='txt_dd_n_fogo']").val('');

        $("#txt_dd_marca").prop("disabled", true);
        $("#txt_dd_medida").prop("disabled", true);
        $("#txt_dd_mm").prop("disabled", true);
        $("#txt_dd_data").prop("disabled", true);
        $("#txt_dd_km").prop("disabled", true);
        $("#txt_dd_estado").prop("disabled", true);
        $("#txt_dd_obs").prop("disabled", true);
        $("#txt_dd_img").prop("disabled", true);
        $("#bt_salvar").prop("hidden", true);

        }else{
            $("#txt_dd_marca").prop("disabled", false);
            $("#txt_dd_medida").prop("disabled", false);
            $("#txt_dd_mm").prop("disabled", false);
            $("#txt_dd_data").prop("disabled", false);
            $("#txt_dd_km").prop("disabled", false);
            $("#txt_dd_estado").prop("disabled", false);
            $("#txt_dd_obs").prop("disabled", false);
            $("#txt_dd_img").prop("disabled", false);
            $("#bt_salvar").prop("hidden", false);
        }
                        
      });
    });
  });
<div class="form-group">
   
  <input type="text" class="form-control form-control-sm" name="txt_dd_n_fogo" id="txt_dd_n_fogo" required placeholder="Nº de fogo do pneu">
  
  </div>


<div class="form-group">

  <select class="form-control form-control-sm" name="txt_dd_marca" id="txt_dd_marca" required disabled>
  <option value="">Marca do pneu</option>
                    <option  value="BRIDGESTONE">BRIDGESTONE</option>
                    <option  value="CENTAURO">CENTAURO</option>
                    <option  value="CONTINENTAL">CONTINENTAL</option>
                    <option  value="FATE">FATE</option>
                    <option  value="FIRESTONE">FIRESTONE</option>
                    <option  value="GOODYEAR">GOODYEAR</option>
                    <option  value="KUMHO">KUMHO</option>
                    <option  value="LANDE">LANDE</option>
                    <option  value="MARSHAL">MARSHAL</option>
                    <option  value="MAGGION">MAGGION</option>
                    <option  value="MASTER">MASTER</option>
                    <option  value="MICHELIN">MICHELIN</option>
                    <option  value="PIRELLI">PIRELLI</option>
                    <option  value="SEIBERLING">SEIBERLING</option>
                    <option  value="TOYO">TOYO</option>
                    <option  value="YOKOHAMA">YOKOHAMA</option>
  </select>
</div>

<div class="form-group">
<select class="form-control form-control-sm" name="txt_dd_medida" id="txt_dd_medida" required disabled>
    <option value="">Medida do pneu</option>
    <option value="205/75">205/75</option>
    <option value="215/75">215/75</option>
    <option value="215/75.17.5">215/75.17.5</option>
    <option value="215/80">215/80</option>
    <option value="235/75">235/75</option>
    <option value="275/70">275/70</option>
    <option value="275/80">275/80</option>
    <option value="295/80">295/80</option>
    <option value="385/65">385/65</option>
    <option value="750/16">750/16</option>
    <option value="900/20">900/20</option>
    <option value="1000/20 comum">1000/20 comum</option>
    <option value="1000/20 radial">1000/20 radial</option>
    <option value="1100/20">1100/20</option>
    </select>

</div>

<div class="form-group">
   
  <input type="text" class="form-control form-control-sm" name="txt_dd_mm" id="txt_dd_mm" placeholder="Milímetro(Atual)"  disabled>
  </div>

<div class="form-group">
   <!-- <label for="txt_de_km">KM</label>  -->
  <input class="form-control form-control-sm" type="text" name="txt_dd_km" id="txt_dd_km" placeholder="KM" required disabled>
</div>


<div class="form-group">
<select class="form-control form-control-sm" name="txt_dd_estado" id="txt_dd_estado" required disabled>
        <option value="">Estado do pneu</option>
        <option  value="NOVO">NOVO</option>
        
        <option  value="NOVO USADO">NOVO USADO</option>
        <option  value="NOVO CONSERTADO">NOVO CONSERTADO</option>
        <option  value="1ª RESSOLAGEM">1ª RESSOLAGEM</option>
        <option  value="2ª RESSOLAGEM">2ª RESSOLAGEM</option>
        <option  value="3ª RESSOLAGEM">3ª RESSOLAGEM</option>
        <option  value="4ª RESSOLAGEM">4ª RESSOLAGEM</option>
        <option  value="COM AVARIAS">COM AVARIAS</option>
        <option  value="DESCARTADO">DESCARTADO</option>
        <option  value="RESSOLADO CONSERTADO">RESSOLADO CONSERTADO</option>
        <option  value="VULCANIZAR">VULCANIZAR</option>
     </select>

</div>

<div class="form-group">
 
  <textarea class="form-control" name="txt_dd_obs" id="txt_dd_obs" rows="2" placeholder="Observações"  disabled></textarea>
  </div>

<div class="custom-file">

  <input type="file" name="txt_dd_img" class="custom-file-input" id="txt_dd_img" lang="pt-br" onchange="readURLdd(this);"  disabled>
  
  <label class="custom-file-label" for="customFile">Escolha uma imagem</label>

</div> 
        <input type="submit" class="btn btn-primary" name="bt_dd" id="bt_salvar" value="Salvar" hidden>

 

1 answer

0


The problem, it seems, is here:

$("input[name='txt_dd_n_fogo']").blur( function(){  

To perform the same functions you are running using the input type element, you must do the same thing for select type elements.

For example: Note that below the element is select.

$("select").change(function(){
 var txt_dd_n_fogo = $("input[name='txt_dd_n_fogo']").val();

    $.post('posicoes/function.php',{txt_dd_n_fogo: txt_dd_n_fogo},function(data){

    if( data!='Não existe ainda!' ){ 
       alert(data);

       $("input[name='txt_dd_n_fogo']").val('');

        $("#txt_dd_marca").prop("disabled", true);
        $("#txt_dd_medida").prop("disabled", true);
        $("#txt_dd_mm").prop("disabled", true);
        $("#txt_dd_data").prop("disabled", true);
        $("#txt_dd_km").prop("disabled", true);
        $("#txt_dd_estado").prop("disabled", true);
        $("#txt_dd_obs").prop("disabled", true);
        $("#txt_dd_img").prop("disabled", true);
        $("#bt_salvar").prop("hidden", true);

        }else{
            $("#txt_dd_marca").prop("disabled", false);
            $("#txt_dd_medida").prop("disabled", false);
            $("#txt_dd_mm").prop("disabled", false);
            $("#txt_dd_data").prop("disabled", false);
            $("#txt_dd_km").prop("disabled", false);
            $("#txt_dd_estado").prop("disabled", false);
            $("#txt_dd_obs").prop("disabled", false);
            $("#txt_dd_img").prop("disabled", false);
            $("#bt_salvar").prop("hidden", false);
        }

      });
    });
});

**O ideal, nesse caso, é fazer uma função com o código e colocar
dentro do evento do input e do select.**
  • I tried to do as you said, but it didn’t work. The first field is input=text, is when losing focus of it the other fields should be enabled. The problem is that the second field is a select and when I click on it the fields do not disable.

  • Try using another event, for example: click $('select'). on("click change", Function(){ //code });

  • Man, thanks for your help, but it didn’t work either. I tried to create a Hidden button on all fields, it even worked, but when filling the field fire number again it no longer performs the check function. Need to be tightly tied, if the user type a number that already exists the fields need to be disabled.

Browser other questions tagged

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