Aviso de perdida de foco!

¿Carlos cómo andas?
Te escribo para comentartequ tengo un problema con la perdida de foco
Tengo un menu con muchas opciones, a su vez tengo un iframe donde se abren los form a los que llamo mediante las opciones de dicho menu.
Lo que no logro hacer es por ejemplo si yo estoy en el form de carga de doctores, y por descuido me quiero ir por ejemplo a otro form que se encuentra en otra opción del menu, me aparezca un cartel diciendo que si en verdad quiero abandonar la página...
Sino pasa que muchas veces te vas a otro menu y perdés toda la info que estabas ingresando en el form en eso momento...

1 Respuesta

Respuesta
1
Lo puedes hacer de dos formas:
1) Que cuando se pulse una opción de menú, antes de llamar a ninguna página ni PHP ni nada, hagas un confirm de javascript:
var salir = confirm("Si sale de la página perderá todos los datos no guardados. ¿Desea salir de la página?");
if (salir==1){
document.frames.miIframe.src = "loquesea.php";

La otra opción, quizás un poco más complicada, es que el control lo tengas en la página de la que vas a salir:

<html>
<head>
<script>
var salidaControlada = false;
function datosNoGuardados = false;
function controlaSalida(){
if (!salidaControlada && datosNoGuardados){
return "Al abandonar esta página perderá todos los datos no guardados";
}
}
</script>
</head>
<body onBeforeUnload="return controlaSalida()">
</body>
</html>

Te explico: hay dos variables que deberías controlar en tu form. Una es salidaControlada, que la deberás poner a true cuando no quieras que se muestre la confirmación, porque realmente quieres abandonar la página. Por ejemplo, cuando hagas un submit del formulario para guardar los datos.
La otra variable es datosNoGuardados, que la deberás poner a true cuando el usuario cambie algún dato del formulario.
Esta última variable es opcional, y si quieres la puedes quitar si no quieres complicarte demasiado la vida. Si la usas, tienes la ventaja de que podrás controlar que saque la confirmación tan solo cuando haya datos no guardados, pero si el usuario no toca nada, no sacará confirmación.
Hola Carlos, gracias por tu respuesta, quería comentarte que me sirve realizar la segunda opción ya que si el usuario recorre varias opciones sin realizar ninguna modificación, le aparecería igual el cartel de confirmación con la primer opción que me propusiste!
Ahora hay cosas que no me quedan bien en claro
Primero como hago para poner en true la variable salidaControlada, es decir, ¿puedo enviar desde el formulario la variable en true para que no me salte el cartel? Ya que cuando quiero enviar el formulario me aparece el cartel de confirmación, que si deseo abandonar la página, como vos me habías anticipado...
¿Segundo para poner en true la variable datosNoGuardados tendría que verificar cada uno de los campos que tengo en el formulario (si es vacío) o hay alguna función que haga esto solo?
Otra cosa que te quería preguntar si esta bien como pusiste esto:
<script>
var salidaControlada = false;
function datosNoGuardados = false;
function controlaSalida(){
if (!salidaControlada && datosNoGuardados){
Porque yo lo modifique para que datosNoGuardados sea una variable y en el if le agregue a datosNoGuardados el !.
Muchas gracias.
Espero tu respuesta saludos...
Diego
Para tu primera pregunta, puedes usar el atributo onbeforesubmit de tu formulario:
<form onbeforesubmit="salidaControlada=true;return true;">
Para lo de actualizar la variable datosNoGuardados, lo puedes hacer controlando que el usuario haya tecleado algo en la página:
<body onkeypress="datosNoGuardados=true; return true;">
Es una primera aproximación. No es exacto 100% porque el usuario ha podido teclear algo, luego borrarlo y que los datos realmente no haya cambiado.
Hola carlos nuevamente!
He logrado realizar lo que quería gracias a tu ayuda.
Nos veremos en la próxima.
Muchísimas gracias!
Un abrazo!
Saludos
Diego

Añade tu respuesta

Haz clic para o

Más respuestas relacionadas