Tengo un script que muestra una ventana modal a través de un link "actualizar correo" (para actualizar correo electrónico del usuario a través de .ajax de jquery). La modal tiene solo dos campos donde se proporciona el nuevo correo electrónico y su confirmación y php valida que los campos no estén vacíos, sea un correo valido, que ambos correos coincidan... En caso de que por ejemplo el primer campo este vacío y envío el formulario lanzo un "alert" (me apoyo de Sexy para cambiar la apariencia de los alert normales) donde le digo al usuario que proporcione un correo electrónico.
Todo funciona ok y la respuesta de php es correcta en json. El problema es que si al enlace que me lanza la modal le doy click 3 veces (por ejemplo) no de forma consecutiva sino que le doy primer click, cierro la modal, otro click, cierro la modal, otro click al enlace y ya en la modal envío el formulario para actualizar el correo electrónico el navegador me hace 3 peticiones de ajax y me muestra 3 veces el alert diciendo que proporcione un correo (retomando el ejemplo del parrafo anterior) cuando solo me debe mostrar el alert 1 sola vez. Hasta que reinicio la página se eliminan esas peticiones ajax "encoladas" por cada click que le doy a mi enlace para mostrar la modal.
Como puedo evitar que por cada click para mostrar la modal me cree una nueva petición ajax?
P.D. Me apoyo de firebug para ver quelas peticiones ajax son las mismas que el numero de click al enlace que lanza mi modal ...
Mi codigo es:
Cita:
$('#changeMail').click(function() {
$.blockUI({
message: $('#DivChangeForm'),
centerY: false,
css: { top: '150px'},
onOverlayClick: $.unblockUI
});
$('#btnActualizar').click(function (event) {
event.preventDefault();
$('#btnActualizar').hide();
var datos = $(this).serialize();
$.ajax({
type: "POST",
url: 'mod/updateMailUser.php',
dataType: "json",
data: datos,
cache: false
})
.done(function(respuesta) {
switch (respuesta.status){
case 1:
$('#btnActualizar').show();
Sexy.error('<h1>Mensaje del sistema </h1><p> <br />' + respuesta.mensaje + '.</p>');
// alert(respuesta.mensaje);
break;
case 2:
case 3:
Sexy.info('<h1>Mensaje del sistema </h1><p> <br />' + respuesta.mensaje + '.</p>');
$.unblockUI();
document.location.reload();
break;
default:
Sexy.error('<h1>Mensaje del sistema </h1><p> <br />Error al procesar la información. Intente mas tarde.</p>');
break;
return false;
}
return false;
});
return false;
});
return false;
});
$.blockUI({
message: $('#DivChangeForm'),
centerY: false,
css: { top: '150px'},
onOverlayClick: $.unblockUI
});
$('#btnActualizar').click(function (event) {
event.preventDefault();
$('#btnActualizar').hide();
var datos = $(this).serialize();
$.ajax({
type: "POST",
url: 'mod/updateMailUser.php',
dataType: "json",
data: datos,
cache: false
})
.done(function(respuesta) {
switch (respuesta.status){
case 1:
$('#btnActualizar').show();
Sexy.error('<h1>Mensaje del sistema </h1><p> <br />' + respuesta.mensaje + '.</p>');
// alert(respuesta.mensaje);
break;
case 2:
case 3:
Sexy.info('<h1>Mensaje del sistema </h1><p> <br />' + respuesta.mensaje + '.</p>');
$.unblockUI();
document.location.reload();
break;
default:
Sexy.error('<h1>Mensaje del sistema </h1><p> <br />Error al procesar la información. Intente mas tarde.</p>');
break;
return false;
}
return false;
});
return false;
});
return false;
});