Mensajes

[WHK]

Eso de utilizar alertas en campos vacios es de cavernicolas, lo que debes hacer es crear un evento onblur del input donde si el campo está vacio entonces mostrar un pequeño texto de color rojo al costado derecho diciendo que el campo es requerido, luego desde el código dinámico (cgi, php, asp) debes volver a verificar que estos campos no vengan vacios porque recuerda que hay un gran porcentaje de usuarios en todo el mundo que navegan sin javascriopt y puedes abrir una brecha de seguridad importante.

En jQuery sería algo así:

Código (javascript) [Seleccionar] Expandir

$(document).ready(function(){
$('#input_1').blur(function(){
if($(this).text() == '')
$('#leyenda_error_1').fadeIn();
else
$('#leyenda_error_1').fadeOut();
});
});

Acá te dejo un demo que hice:
http://jsfiddle.net/dA6Qd/

Código (html4strict) [Seleccionar] Expandir

<style type="text/css">
#action > p > span{ color: red; display: none; }
</style>

<script type="text/javascript">
$(document).ready(function(){
$('#action > p > input').blur(function(){
if($(this).val() == '')
$('#leyenda_' + $(this).attr('name')).fadeIn();
else
$('#leyenda_' + $(this).attr('name')).fadeOut();
});
$('#action').submit(function(){
$(this).find('input').blur();
if($(this).find('span:visible').length)
return false;
});
});
</script>

<form action="#" method="post" id="action">
<p><input type="text" name="nombre" /> : Nombre <span id="leyenda_nombre">(El nombre es obligatorio)</span></p>
<p><input type="text" name="mail" /> : Mail <span id="leyenda_mail">(El correo es obligatorio)</span></p>
<p><input type="submit" value="Enviar datos" /></p>
</form>

Lo genial es que es compatible con todos los navegadores existentes.

Pues muchas gracias WHK. Esta tarde me pondré manos a la obra a hacer pruebas con tu ejemplo. Se agradece de verdad tu aclaración de los usuarios que llevan noscript

A ver, la cosa es que quiero aprender a hacerlo porque me parece una funcionalidad útil para una web, y si en un futuro, cuando me dedique a esto, si un cliente me pide algo parecido, yo poderselo ofrecer. Es un ejercicio que estoy haxciendo por mi cuenta para practicar, pero como he dicho, esa funcionalidad me parece útil y de ahí mi interés.

No te lo tomes a mal, pero a  mi gustan las cosas bien hechas, aunque me impliquen dolores de cabeza hasta que encuentro la forma de hacerlo.

Edito: acabo de ver que decías que era una broma

No sé a que te refieres exactamente con restructurar mi código. A parte, hay más funciones que hacen bien su cometido...Si es necesario subo el código entero a mega para que le echéis un vistazo...

hola, ps yo no complicaría tanto solamente coloca requerid al final de los input q no quieres q estén vacíos y listo adiós javascript.

Código [Seleccionar] Expandir


<input type="text" id="mi input" name="name" required>


no recuerdo si funciona en IE, pero bueno, si quieren ver algo bien q utilicen un navegador bueno xD

A ver, la cosa es que quiero aprender a hacerlo porque me parece una funcionalidad útil para una web, y si en un futuro, cuando me dedique a esto, si un cliente me pide algo parecido, yo poderselo ofrecer. Es un ejercicio que estoy haxciendo por mi cuenta para practicar, pero como he dicho, esa funcionalidad me parece útil y de ahí mi interés.

No te lo tomes a mal, pero a  mi gustan las cosas bien hechas, aunque me impliquen dolores de cabeza hasta que encuentro la forma de hacerlo

Deberias reestructurar tu codigo. Tal y como nos lo muestras te deberia de funcionar perfectamente.

Le dices eso a una empresa y te manda a la calle enseguida No funciona ni siquiera en IE9.. Safari (y eso que usa webkit) tampoco lo soporta.
http://caniuse.com/form-validation

Saludos

No sé a que te refieres exactamente con restructurar mi código. A parte, hay más funciones que hacen bien su cometido...Si es necesario subo el código entero a mega para que le echéis un vistazo...

Buenas, a ver si consigo explicar de manera que se entienda bien lo que quiero:

Estoy dandoles funcionalidad a unos formularios. Lo he configurado en javascript, de manera que si se deja alguno de los parametros del formulario en blanco, me saque una alerta diciendo que complete dicho parametro.

Por otra parte, también en javascript, he creado una funcion de resaltar en el caso de que haga focus con el raton en un determinado campo del formulario. En ese caso, se queda dicho elemento marcado con un borde y un cambio del color de su respectivo textarea.

Pues bien, lo que me gustaría es que además de lanzarme la alerta de que tengo que rellenar el campo vacío del formulario, automaticamente se me quedase marcado dicho campo (como si lo hubiera pulsado con el ratón).

He buscado información, y lo que he hecho es esto:

Código [Seleccionar] Expandir

... if (nombre.length==0) {
alert("Inserte su nombre completo");
document.getElementById("nombre").focus() ...

Así mismo, ya tenía establecida de antes la función "resaltar" que se activa cuando ese elemento está onfocus (determinado en el propio html que se active la funcion resaltar cuando el elemento en cuestion esté onfocus "onfocus="resaltar('nombre')" ")

Código [Seleccionar] Expandir

function resaltar(mi_id) {
document.getElementById(mi_id).style.border="2px solid #e6b700";
document.getElementById(mi_id).style.backgroundColor="#F5F5F5";
}


El problema, es que de la manera en la que lo he hecho funciona quedando resaltado un instante, para apagarse inmediatamente, y lo que yo quiero es que se quede permanetemente hasta que marque otro elemento.

Espero que se haya entendido bien mi problema...

Un saludo

Pues sí, era eso. Muchas gracias. No sabía que había que poner ";" ¿Sólo es en el caso del placeholder? Porque en el caso de texto normal en html, funciona sin el ";"  sin problemas...

Hola,

Estaba haciendo unas prácticas de formularios con javascript y no he encontrado la forma de escribir en un campo placeholder el acento. Lo he intentado con el código html (Málaga--> M&aacutelaga) y javascript (Málaga-->M\u00e1laga), y ninguno de los dos me ha dado resultado. He buscado información y no he encontrado nada...

¿Alguien sabe la manera (si se puede, que no lo sé) de poner los acentos en esos casos?

Al final parece ser que el problema estaba en guardar eligiendo el tipo de extensión en vez de escribirla al final del nombre del archivo (nombre_archivo.css). Muchas gracias por las ayudas. Lo que me gustaría saber es por qué falla al guardar eligiendo el tipo de extensión cuando en otros editores de texto , como Notepad++,  funciona perfectamente...

Hasta ahora guardaba seleccionando la extensión sin escribirla. Probaré de esa manera a ver que tal. En cuanto a lo de mirar la consola, nunca me paré con esas cosas, investigaré a ver si descubro algo...

Ahora mismo estoy con Notepad++, que ni de lejos tiene las ayudas de Sublime Text, y también me he descargado Dreamviewer, que si bien tiene ayudas, son también peores que las de Sublime Text, además no autoindenta dentro de las etiquetas, y son acciones que te hacen perder tiempo. Además, me basto usarlo poco para descubrir un bug: los comentarios no me los escribe con colores más debiles a partir de un número determinado, pudiendose confundir con el resto del código si se echa un vistazo rápido.

Soy un poco tiquismiquis a la hora de programar, pero es que en mi caso ganaba muchísimo tiempo con Sublime Text 2 y me duele mucho no poder disfrutar más de sus ventajas...

algun editor de texto con las bondades de sublime text que no de problemas?

Nunca he probado ese editor. Para mi lo más importante son las ayudas sintácticas, de manera que pueda autocompletar, y que además me cierre las etiquetas para que no se me olviden y después tenga que estar buscando errores.

Es que hasta que me funcionó bien había ganado muchísima eficiencia, de haí mi cabreo monumental cuando ví que se me cortó el royo...