Resulta que estoy haciendo un proyecto (basicamente la intranet), el profesor nos ah pedido que hagamos una validacion con jquery para el inicio de sesion ,y que ademas contenga un captcha, ya eh conseguido hacer estas cosas, pero cuando quise implementarlo todo en un slider de top panel no me sale. este es mi codigo:
Index.jsp:
Código HTML:
<%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> <title>::Universidad de Centro de Peru::</title> <!-- VALIDACION --> <script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript" src="js/jquery.metadata.js"></script> <script type="text/javascript" src="js/jquery.validate.js"></script> <link rel="stylesheet" type="text/css" media="screen" href="css/screen.css" /> <!-- SLIDER --> <!-- stylesheets --> <link rel="stylesheet" href="css/slide/style.css" type="text/css" media="screen" /> <link rel="stylesheet" href="css/slide/slide.css" type="text/css" media="screen" /> <!-- PNG FIX for IE6 --> <!-- http://24ways.org/2007/supersleight-transparent-png-in-ie6 --> <!--[if lte IE 6]> <script type="text/javascript" src="js/slide/pngfix/supersleight-min.js"></script> <![endif]--> <!-- jQuery - the core --> <script src="js/slide/jquery-1.3.2.min.js" type="text/javascript"></script> <!-- Sliding effect --> <script src="js/slide/slide.js" type="text/javascript"></script> <!-- CONTENIDO --> <link href="css/portada/uco.css" rel="stylesheet" type="text/css"> <style type="text/css"> <!-- .Estilo5 {color: #990033} .Estilo8 {font-size: 9px; color: #000000; font-family: verdana; font-weight: bold; text-align: left;} .Estilo11 {color: #7b7b7b} --> </style> </head> <body> <!-- SLIDER --> <!-- Panel --> <div id="toppanel"> <div id="panel"> <div class="content clearfix"> <div class="left"> <h1> </h1> <h2>Monkar!</h2> <p class="grey">Usted debe proporcionar sus credenciales para poder acceder al sistema de Intranet Monkar !</p> <h2> </h2> </div> <div class="left right"> <!-- Login Form --> <form id="AccesoUsuario" class="clearfix" action="" method="post"> <h1>Acceso</h1> <label class="grey" for="log">Usuario:</label> <input class="{required:true,rangelength:[8,8]}"type="text" name="txtLogin" id="txtLogin" value="" size="23" /> <label class="grey" for="pwd">Contraseña:</label> <input class="{required:true,maxlength:[8]}" type="password" name="txtPassword" id="txtPassword" size="23" /> </p> <div class="error"> </div> <p> <label><input name="recuerdame" id="recuerdame" type="checkbox" checked="checked" value="forever" /> Recuerdame</label> <div class="clear"></div> <input type="submit" name="submit" value="Acceder" class="bt_login" /> <a class="lost-pwd" href="#">Perdiste tu contraseña?</a> </form> </div> <script type="text/javascript"> $(document).ready(function(){ $("#AccesoUsuario").validate(); }); </script> </div> </div> <!-- /login --> <!-- The tab on top --> <div class="tab"> <ul class="login"> <li class="left"> </li> <li>Hola Invitado !!</li> <li class="sep">|</li> <li id="toggle"> <a id="open" class="open" href="#">Acceder</a> <a id="close" style="display: none;" class="close" href="#">Cerrar Panel</a> </li> <li class="right"> </li> </ul> </div> <!-- / top --> </div> <!--panel -->
Se supone que con eso deberia salir (porque ya hize otro index donde si sale, pero cuando intento hacerlo con el top panel no funciona)
Deberia funcionar asi:
doy click en una pestaña para que baje un panel superior, que esta como escondido, en ese panel esta el login. hasta ahi funciona el slider.
pero cuando le agrego el validate, cuya funcion es que salga mensajes de error cada vez que dejo las cajas en blanco,o me excedo del numeor de caracteres permitido, etc.
pero no me valida, no entiendo que esta mal
es un jsp, aunque de echo deberia funcionar aun siendo un html.
Alguien detecta algun error???
si pudieran ayudarme les estaria muy agradecido.