18 noviembre 2010

Javascript y JQuery: Ejecutar una acción al abandonar una página web

Con Javascript y JQuery es bastante sencillo hacer que suceda algo al abandonar una página web. Contamos para ello con el evento unload. Así podemos, por ejemplo, mostrar un cuadro que indique que se está realizando una operación y hacer que ese cuadro se oculte al abandonar la página.

El sentido de esta opción es evitar que si el usuario pulsa la tecla de volver a la página anterior se encuentre con el cuadro de carga del que hablábamos. La función podría quedar así:

$(document).ready(function() {
    $(window).unload( function () { $('#precarga').hide('slow'); } );
});

En la página tenemos un div oculto con display:none que contiene un mensaje del tipo "Cargando...". Por ejemplo:

<div id='precarga' style='display:none;'>Accediendo a la base de datos. Puede llevar unos segundos.</div>

Así, cuando alguien pulsa en un botón para acceder a otra página mostramos la capa oculta llamada #precarga mediante

$('#precarga').show();

Con la tranquilidad de que el mensaje se ocultará en el preciso instante en el que el navegador abandone la página actual.

12 noviembre 2010

Comprobar en Javascript que se ha activado una casilla de un conjunto

Una pequeña solución rápida para cuando tenemos una página web con un conjunto de casillas de verificación (chebox) y necesitamos comprobar que al menos se ha activado una de ellas.

Los campos en la página html serían como estos:

<input type="checkbox" name="coleccion" value="1">Texto1
<input type="checkbox" name="coleccion" value="2">Texto2
<input type="checkbox" name="coleccion" value="3">Texto3

La función que podría controlarlo sería algo así:

function Hay_Elementos(nombre_campos) {
var hay=false;
elementos = document.getElementsByName(nombre_campos);
for (i=0;i <elementos.length;i++) {
if (elementos[i].checked) hay=true;
}
return (hay);
}

Por último la llamada a esa función se haría así:

if (!Hay_Elementos('coleccion'))
alert("Debe activar al menos una casilla.");

Si no se ha activado ninguna casilla obtendremos el mensaje. En caso contrario el script seguirá su camino.

Y aquí lo dejo para que no se me olvide.