Siempre que hacemos un formulario, necesitamos un script de validación, el problema es siempre tener un script que sea facil de usar, lo suficientemente flexible para que funcione en cualquier formulario y que sea personalizable, encontré justamente eso.
HTML de formulario para validar
Solo debemos fijarnos bien en el id del formulario y para los campos que deseamos validar agregar una clase required, email, etc
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 | <form name="comentariosFrm" id="comentariosFrm" method="post" action=""> <ol> <li> <label>Nombre: (requerido al menos dos caracteres)</label> <input id="cname" name="name" class="required" minlength="2" /> </li> <li> <label>E-mail: (requerido)</label> <input id="cemail" name="email" class="required email" minlength="2" /> </li> <li> <label>Tu página web: (opcional)</label> <input id="curl" name="url" class="url" value="" /> </li> <li> <label>Comentarios: (requerido)</label> <textarea id="ccomentario" name="comentario" class="required"></textarea> </li> <p align="center"><input type="submit" name="submit" value="Enviar" /></p> </ol> </form> |
Agregar el validador
Primero debemos incluir la libreria jquery, el validador y con una sola linea de texto le decimos que formulario validar
1 2 3 4 5 6 7 | <script src="js/jquery-1.3.1.min.js" type="text/javascript"></script> <script src="js/jquery.validate.min.js" type="text/javascript"></script> <script type="text/javascript"> $(document).ready(function() { $("#comentariosFrm").validate(); }); </script> |
Puedes ver más ejemplos y descargar el script en la página de Bassistance
Excelente Aporte
Buen aporte
realmente ayuda, pero tengo una duda, imaginemos que valida los campos nombre, apellidos y demas, una vez que esten bien ingresados se supone que los datos deberian ser pasados a una pagina .php que procese la informacion, quisiera baber en que parte del codigo debo llamar la pagina .php es decir algo como esto
if(todo esta correcto)
{
llamar a la pagina mensaje.php
}
esas es mi duda, porque se de que relamente funciona la validacion gracias por todo
Hola, me parece que estas confundiendo la validacion en el lado del usuario con la validacion en el lado del servidor. En este post hablo de una validacion javascript en el lado del usuario por eso no requiere colocar codigo PHP sino que intercepta el evento submit y usa el action del formulario para decir a que pagina .php deben procesarse.
Adicionalmente a eso es posible validar datos via php(lado del servidor) sumado a un captcha para evitar que algun robot use nuestro formulario.
Hola!
Veo que para agregar CSS o cosas de Ajax, en formularios por ejemplo, veo que se usa mucho y … en vez de .
Pregunto:
Es que es preferible asi? cuando veo ejemplos asi y trato de adaptarlos a digamos que su traspaso no ha sido muy fluido.
Que mejoras o diferencias podria tener si usara en vez de , usara y demas mencionados? me preocuparia no tener un buen contenedor de datos que se viese mal en otros navegadores.
Tambien de que con tablas uno mete tablas dentro de otras con distintas filas y/0 columnas y no se que tal igual o sin dificultades seria con los y y .
saludos.
Este script validador agrega una etiqueta span con el mensaje de error si usaras tablas tendrias que modificar en el CSS el FLOAT y debería verse bien aunque como te digo eso varía para cada caso concreto, para evitar problemas entre navegadores usa un hoja de reseteo y a cruzar los dedos
Estoy trabajando en algo en donde incorporare este aspecto a todo lo concerniente a formularios
http://jqueryui.com/themeroller/
Y por eso la pregunta de los (div),(u),(p)(label) en vez de (table) ya que las tablas ayudan a tener todo contenido en un “marco” por asi decirlo sabemos bien y ayuda a que en distintos navegadores no se desproprociona posicionalmente las cosas, y no se si el equivalente el (div) sea igual.
Este googleapis que indico, me interesa mas por los tabs y tuve que meter en una tabla principal esto para poderlo centrar en la pagina ya que el marco del (div) se ensanchaba con la pagina y solo quiero que su ancho sea igual al ancho de la suma de los tabs.
Y todo esto, me preocupa es que luego de ya tener tanto hecho se presenten los problemas, de ahi esta asesoria.
En realidad no son equivalentes, funcionan de forma muy distinta y por experiencia no es facil pasar algo ya hecho en tablas a DIV asi que te recomendaria que mantengas tu estructura con tablas, agregues los DIV que requieras para la jquery UI y en el futuro trabajes con DIV un tutorial de como funcionan AQUI
Bueno, los div estan en una tabla padre como contenedor, pero ya dentro de esta tabla, todo lo demas es div ya que al no usarlos y cambiarlos por tablas se desparece el estilo, aunque me imagino que eso podria cambiarse el .js o .css del que se llama, alguna validacion de div cambiarse a table, no se, hago conjeturas, pero creo que con un table mayor puedo seguir como voy.
Lo que si molesta de los div o con el style aplicado es para escritos largos en una misma fila, en este caso los (p), por lo que uso y me sirve.
gracias.
Por lo que me dices estas usando de forma incorrecta los DIV, con esos ejemplos ajax no pueden reemplazar los DIV con tablas (funcionan muy distinto y ni con css o javascript van a funcionar igual) cuando se escribe codigo se usan tabulaciones y saltos de pagina no todo en una sola linea (una cuestion de orden que ayuda a entender nuestro codigo), los estilos no se escriben en linea para eso inventaron las hojas de estilos, clases, etc.
pero es que si me esta sirviendo hasta el momento o al menos lo que he agregado de estos ejemplos.
En caso de alguna confusion o mal entendido, sigo usando los div solo he puesto una table principal y dentro esto de los div y hasta el momento va bien.