Foros del Web » Programando para Internet » Jquery »

[SOLUCIONADO] jquery validate no funciona

Estas en el tema de jquery validate no funciona en el foro de Jquery en Foros del Web. Hola, estoy intentando hacer una validación con Validate, pero no lo consigo. Creo que no se está ejecutando la validación, porque no hace nada, simplemente ...
  #1 (permalink)  
Antiguo 27/05/2013, 05:24
 
Fecha de Ingreso: octubre-2012
Mensajes: 11
Antigüedad: 12 años, 1 mes
Puntos: 0
jquery validate no funciona

Hola, estoy intentando hacer una validación con Validate, pero no lo consigo. Creo que no se está ejecutando la validación, porque no hace nada, simplemente se envía el formulario al action sin comprobar nada. De momento solo he puesto como requerido el campo nif.

He leído muchos posts que hablan de problemas con jquery validate pero en ninguno he encontrado la solución.

Pensaba que podría haber algún problema con validate al generar algunos campos dinámicamente, pero dejando el formulario básico sin opción de generar campos tampoco me hace la validación.

Pongo aquí el código de mi página a ver si a alguien se le ocurre por qué no me funciona, gracias de ante mano!

Código HTML:
<?php
	session_start();
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Formulario inscripción</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link rel="stylesheet" href="css/bootstrap-responsive.css" type="text/css" media="screen" />
<link rel="stylesheet" href="css/bootstrap.css" type="text/css" media="screen" />
<script type="text/javascript" src="./tiny_mce/tiny_mce.js"></script>
<script type="text/javascript" src="./js/jquery.js"></script>
<script src="./js/jquery-validate.js"></script>
<script type="text/javascript">
tinyMCE.init({
        theme : "simple",
        mode : "textareas",
        plugins : "fullpage",
        theme_advanced_buttons3_add : "fullpage",
        width: '100%'
});
</script>
<script>
$(document).ready(function(){
  $("#btneliminar").hide();
  $("#divcomunicacion").hide();
  $("#btnisertar").click(function(){   
    var i = $("#numpart").val();      
    $('<div class="divpart span12"><div class="clearfix">&nbsp;</div><label>Nombre: </label><input name="nombrepart['+i+']" type="text" class="field span3" /> <label>Apellidos: </label><input name="apellidospart['+i+']" type="text" class="field span3" /> <label>e-mail: </label><input name="emailpart['+i+']" type="text" class="field span4"/></div>').appendTo("div.camposnuevos").fadeIn("slow");
    i++;    
    $("#numpart").val(i);    
    if(i==2){
        $("#btneliminar").delay(300).show("slow");
    }
  });

  $("#btneliminar").click(function(){
    var i = $("#numpart").val();
    if(i!=1){      
      $("div.divpart:last").remove();
      i--;
      $("#numpart").val(i);
      if(i==1){
        $("#btneliminar").hide("slow");
      }
    }
  });

  $("#chkcomunicacion").change(function(){
    if($(this).is(':checked')){
      $("#divcomunicacion").show("slow");
    }else{
       $("#divcomunicacion").hide("slow");
    }
  });
  
  $("#btnenviar").click(function(){    
    $("#formulario").validate();
  });
  
});  
</script>
</head>
<body>
<!-- bootsnip -->
 <div class="container-fluid">
  <div class="row-fluid">
  <br/>
<form id="formulario" method="post" action="./controller/controllerForm.php" class="form-inline">
  <fieldset>
    <legend>Formulario de inscripción</legend>
  <div class="well well-large">
  <div class="control-group">
    <div class="controls">      
       <input type="text" name="nombre" id="nombre" maxlength="30" placeholder="nombre" class="field span4"/>      

      <input type="text" name="apellido1" id="apellido1" maxlength="40" placeholder="apellidos" class="field span8"/>      
    </div>
  </div>

<div class="control-group">
    <div class="controls">
      
      <input type="text" name="nif" maxlength="9" class="required"/>
      
      <input type="text" name="email" maxlength="150" placeholder="email" class="field span6"/>     
      
      <input type="text" name="telefono" id="telefono" maxlength="9" placeholder="teléfono" class="field span3"/>

    </div>    
  </div>
  <div>
  <div style="text-align:left"><h5>Por favor, si va a presentar comunicación marque la siguiente casilla</h5></div>    
<label class="checkbox">
     <input type="checkbox" name="chkcomunicacion" id="chkcomunicacion" value="si"> Presenta comunicación
</label>
</div>
<div class="clearfix">&nbsp;</div>

  <div class="span11" id="divcomunicacion">
    <!-- Text input-->
    <div class="control-group">
      <label class="control-label">Título:</label>
        <input id="textinput" name="textinput" type="text" placeholder="título de la comunicación" class="input-xlarge">      
    </div>

    <!-- Text input-->
    <div class="control-group">
      <label class="control-label">Autores:</label>
        <input id="textinput" name="textinput" type="text" placeholder="nombre completo de los autores" class="input-xlarge">        
    </div>

    <!-- File Button --> 
    <div class="control-group">
      <label class="control-label">Adjuntar pdf:</label>
        <input id="filebutton" name="filebutton" class="input-file" type="file">
    </div>
    <!-- participantes -->
    <div class="control-group">
    <div class="controls">
    <div class="camposnuevos"><?php
         $i=1;                    
         echo "<input type=\"hidden\" name=\"numpart\" id=\"numpart\" value=\"$i\" />";
         ?> 
    </div>
    <div class="clearfix">&nbsp;</div>
    <div class="span12"><a href="#" id="btnisertar" class="btn btn-info btn-mini">Nuevo participante</a>  
    <a id="btneliminar" class="btn btn-danger btn-mini" href="#">Eliminar participante</a>
    </div>
    </div>
  </div>
    <!-- /participantes -->
  </div><!-- span11 -->
  
<div id="apellido1div" style="display:none" class="alert alert-error"><p class="hugo-p">Apellidos obligatorio</p></div>

 <div id="nombrediv" style="display:none" class="alert alert-error"><p class="hugo-p">El primer apellido es obligatorio</p></div>

 <div id="correodiv" style="display:none" class="alert alert-error"><p class="hugo-p">El email es obligatorio</p></div>

 <div id="nifdiv" style="display:none" class="alert alert-error"><p class="hugo-p">El nif es obligatorio</p></div>
<center><input id="btnenviar" type="submit" class="btn btn-danger btn-large" value="enviar"/></center>
</div><!-- well -->
</form>
<!-- ------------------ -->
 </div>
</div>
</body>
</html> 
  #2 (permalink)  
Antiguo 27/05/2013, 08:41
(Desactivado)
 
Fecha de Ingreso: abril-2013
Ubicación: rosario
Mensajes: 248
Antigüedad: 11 años, 7 meses
Puntos: 17
Respuesta: jquery validate no funciona

esta linea $("#formulario").validate(); no hace falta q este dentro del evento submit, dejala afuera ,es decir, en el scope del $(document).ready(function(){
  #3 (permalink)  
Antiguo 28/05/2013, 01:27
 
Fecha de Ingreso: octubre-2012
Mensajes: 11
Antigüedad: 12 años, 1 mes
Puntos: 0
Respuesta: jquery validate no funciona

Vale, es que la puse dentro de ese evento porque hice mil pruebas a ver si me funcionaba, pero bueno, empecé haciéndolo como dices, dentro del $(document).ready pero tampoco me hace caso, de hecho lo acabo de dejar así y sigue sin funcionar.

Gracias por tu respuesta
  #4 (permalink)  
Antiguo 28/05/2013, 11:03
Avatar de fhederico  
Fecha de Ingreso: agosto-2009
Mensajes: 247
Antigüedad: 15 años, 4 meses
Puntos: 23
Respuesta: jquery validate no funciona

Me llama la atencion esto:

Código:
<script src="./js/jquery-validate.js"></script>
Estas seguro que el nombre esta correcto? intentaste cargar este Script a travez del Firebug?? o ver si el nombre del archivo esta correcto.

Normalmente es:

Código:
<script type="text/javascript" src="./js/jquery.validate.js"></script>
ó

Código:
<script type="text/javascript" src="./js/jquery.validate.min.js"></script>

Y se carga simplemente:

Código:
<script type="text/javascript">
$(document).ready(function(){
      $("#formulario").validate();
});
</script>
Saludos
  #5 (permalink)  
Antiguo 29/05/2013, 02:33
 
Fecha de Ingreso: octubre-2012
Mensajes: 11
Antigüedad: 12 años, 1 mes
Puntos: 0
Respuesta: jquery validate no funciona

Bueno pues ya está! A ver, el nombre del fichero era correcto y estaba en el lugar correcto. El firebug me decía que estaba bien, y si pinchabas en la ruta te mostraba el contenido del fichero js.

El problema era precisamente el nombre, al parecer el guión "-" en el nombre debe de crear algún conflicto que hace que no se ejecute. La verdad que no sé por qué tenía el guión en el nombre, me lo descargué así. Simplemente cambiando el nombre:

jquery-validate.js por jquery.validate.js funciona

Muchas gracias por tu respuesta fhederico!

Etiquetas: Ninguno
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 13:23.