Tienes dos errores. Uno de concepto y otro de código:
Concepto: El método
validate
no tiene que ser invocado en el eventoclick
sino en elload
. Digamos que de esa forma estás asignado las reglas de validación a tu formulario al cargar el DOM.Código: Por otro lado, tu
form
esparticipantes
y tu botónbuscar
y los estás llamando al revés.
Te dejo una demo funcionando. Como ves elimino el click ya que no es necesario:
$(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>