jquery does not issue a validation message

Navigation
0

Hello a warm greeting to the community, today I bring you a new problem which is a simple validation with jquery.validate plugin, the subject is the following I have my form in html: 

<div class="container" align="center"><br>
  <fieldset><br>
    <legend>Busqueda Participantes</legend>
    <form class="form-inline" method="post" id="participantes" name="participantes">
      <div>

          <input type="text" class="form-control" placeholder="Cedula" name="cedula" id="cedula">         
          <input type="hidden" name="buscar" id="buscar">
      </div>
      <div class="form-group">
          <input type="submit" value="Buscar" class="btn btn-primary" name="buscar" id="buscar">      
      </div>    
    </form><br>
  </fieldset><br>
</div>

and on the other side my script with the code of jquery validate to validate the field cedula 

$(function(){
    //$(document).ready(function(){
    //$(document).on("ready",function(){
    $("#participantes").on("click",function(){
        $("#buscar").validate
        //errorClass: "error",
        alert("LLega hasta aqui");
        ({
            rules:
            {
                cedula:{required:true,number:true,min:100000,max:99999999}
            },
            messages:
            {
                cedula:{required:'Campo Requerido',min:'Minimo 6 numeros',max:'Maximo 8 Numeros',number:'Solo Numeros'}
            }
        });
    });
});

The issue is that he arrives at the alert ("Come up here"); but I do not know why he does not execute the validation messages that I should have already tried and I do not know what to do, please if anyone knows the answer to this question I will be very grateful.

    
asked by Yader Yepez 28.03.2018 в 18:23
source

2 answers

0

You must add submitHandler to execute the call (so it worked for me) 

$("#participantes").on("click",function(){
  $("#buscar").validate({
    rules:{
     cedula:{required:true,number:true,min:100000,max:99999999}
    },
   messages:{
     cedula:{required:'Campo Requerido',min:'Minimo 6 numeros',max:'Maximo 8 Numeros',number:'Solo Numeros'}
   },
   submitHandler: function(form) {
      form.submit();
    }
  });
});
    
answered by 28.03.2018 в 18:48
0

You have two errors. One of concept and another of code:

  • Concept : The validate method does not have to be invoked in the click event but in the load . Let's say that in this way you are assigned the validation rules to your form when loading the DOM.

  • Code : On the other hand, your form is participantes and your buscar button and you are calling them upside down.

I leave you a demo working. As you can see I eliminate the click since it is not necessary: 

$(function(){
    //$(document).ready(function(){
    //$(document).on("ready",function(){
    $("#participantes").validate({
            rules:
            {
                cedula:{required:true,number:true,min:100000,max:99999999}
            },
            messages:
            {
                cedula:{required:'Campo Requerido',min:'Minimo 6 numeros',max:'Maximo 8 Numeros',number:'Solo Numeros'}
            }
        });   
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.17.0/jquery.validate.js"></script>
<div class="container" align="center"><br>
  <fieldset><br>
    <legend>Busqueda Participantes</legend>
    <form class="form-inline" method="post" id="participantes" name="participantes">
      <div>

          <input type="text" class="form-control" placeholder="Cedula" name="cedula" id="cedula">         
          <input type="hidden" name="buscar" id="buscar">
      </div>
      <div class="form-group">
          <input type="submit" value="Buscar" class="btn btn-primary" name="buscar" id="buscar">      
      </div>    
    </form><br>
  </fieldset><br>
</div>
    
answered by 29.03.2018 в 15:12
How to get the answer of an asynchronous call (AJAX) out of it? DPI-1047: 64-bit Oracle Client library can not be loaded - Django & Windows Server 2012 R2