bug? con jquery.validate y jquery.ui.tabs?

hector2c · #1 (**permalink**) 12/12/2011, 17:29

hola, tengo problemas con jquery.validate y jquery.ui.tabs, tengo 3 pestañas en tabs, 2 de ellos contienen campos de formulario los cuales son requeridos, pero, jquery.validate, solo valida los campos de formulario de las pestañas enfocadas, es muy raro...

el problema no es enfocar la pestaña con el campo requerido, simplemente, ENVIA el formulario si el tab enfocado tiene sus campos rellenados ignorando los input.required de las demas pestañas...

Código HTML:

<!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=utf-8" />
        <title>Documento sin título</title>
        
        <script type="text/javascript" language="javascript" src="../../extras/js/jquery/jquery-1.7.1.min.js"></script>
        <script type="text/javascript" language="javascript" src="../../extras/js/jquery/jquery-ui-1.8.16.custom.min.js"></script>
        <link type="text/css" rel="stylesheet" href="../../extras/js/jquery/jquery-ui-1.8.16.custom.css" />
        
        <script type="text/javascript" language="javascript" src="../../extras/js/jquery.validate/jquery.validate.js"></script>
        
        <script type="text/javascript" language="javascript">
            $(document).ready(function(){
                $("#DivTab").tabs();
                $("#FormSedeAgregar").validate();
            });
        </script>
    </head>
    
    <body>
    
    <form id="FormSedeAgregar" name="FormSedeAgregar" action="javascript: alert(1);">
    
        <div id="DivTab">
            <ul>
                <li><a href="#DivTab1">Datos de persona</a></li>
                <li><a href="#DivTab2">Datos de usuario</a></li>
                <li><a href="#DivTab3">Privilegios de usuario</a></li>
            </ul>
            <div id="DivTab1">
                <input type="text" id="Telefono" name="Telefono" class="required" />
                <input type="text" id="Apellido" name="Apellido" class="required" />
            </div>
    
            <div id="DivTab2">
                <input type="text" id="Clave" name="Clave" class="required" />
                <input type="text" id="Usuario" name="Usuario" class="required" />
            </div>
    
            <div id="DivTab3">
                <p>Algun super extra</p>
            </div>
    
        </div>
    
        <input type="submit" value="Agregar" />
    
    </form>
    
    </body>
</html>

hector2c · #2 (**permalink**) 12/12/2011, 22:53

a nadie le pasa lo mismo???, espero puedan ayudarme, me e estancado mucho por este problema, mil gracias a aquellos que puedan dar alguna soluciòn al problema.

hector2c · #3 (**permalink**) 12/12/2011, 23:56

wow!!!, al parecer el problema es con la libreria jquery.validate!, tengo la versión 1.0.9, pero e realizado el siguiente ejemplo: http://jsbin.com/anahi y use la libreria 1.0.6 y me corre de maravilla con la ultima versión de jquery.ui, espero a alguien le sirva esta observación.

morenometal · #4 (**permalink**) 20/06/2012, 16:38

Cita:

Iniciado por hector2c

wow!!!, al parecer el problema es con la libreria jquery.validate!, tengo la versión 1.0.9, pero e realizado el siguiente ejemplo: [url]http://jsbin.com/anahi[/url] y use la libreria 1.0.6 y me corre de maravilla con la ultima versión de jquery.ui, espero a alguien le sirva esta observación.

Muchas gracias por tomarte la molestia de poner la solucion aun cuando no fue un comentario del post el cual te ayudo, ahora mismo me ha sido de gran utilidad.