I have a jQuery dialog with update panels inside it. To make things a little more complex, I use jQuery validate.
In order to disable the validation, I use jQuery unbind function in beforeClose
. The problem is that unbind "crashes" the update panels.
Is there other way to disable the validation without "crashing" the update panels?
Edit: Unbind also launches postbacks when dialog's button are clicked. The page is completely done with ajax. I don't want a postback in my page.
function mostrarVentanaVehiculo() {
$(document).ready(function () {
var $dialogContentVehiculo = $("#divDatosFacturaVehiculo");
var bDatosModificados = false;
var bGuardar = false;
var dlg = $dialogContentVehiculo.dialog({
modal: true,
title: "Datos de vehículo",
width: '780px',
draggable: false,
resizable: false,
autoOpen: false,
open: function () {
$('#divDatosFacturaVehiculo input[type=text], #divDatosFacturaVehiculo input[type=checkbox],#divDatosFacturaVehiculo select').each(function (i) {
$(this).data('valor_inicial', $(this).val());
});
$("#phContenidos_tbFechaMatriculaOrigen, #phContenidos_tbFechaMatriculaEspana, #phContenidos_tbFechaFab, #phContenidos_tbFechaCaducidad").mask("99/99/99?99");
$("#phContenidos_tbDatosFacturaVehiculoTecnicosMMA, #phContenidos_tbDatosFacturaVehiculoTecnicosCilindrada, #phContenidos_tbDatosFacturaVehiculoTecnicosPotenciaReal").mask("9?999,99");
$("#phContenidos_tbddlDatosFacturaVehiculoTecnicosAsientos, #phContenidos_tbDatosFacturaVehiculoTecnicosNeumaticos").mask("99?99");
},
close: function () {
$dialogContentVehiculo.dialog("destroy");
$dialogContentVehiculo.hide();
$("#phContenidos_hlVehiculoDialogo").focus();
},
buttons: {
"Aceptar": function () {
$('#divDatosFacturaVehiculo input[type=text], #divDatosFacturaVehiculo input[type=checkbox],#divDatosFacturaVehiculo select').each(function (i) {
if ($(this).val() !== $(this).data('valor_inicial')) {
bDatosModificados = true;
}
});
if (bDatosModificados) {
jQuery.validator.messages.required = "";
jQuery.validator.messages.number = "";
jQuery.validator.messages.minlength = "";
$("#mainForm").validate({
ignore: ":disabled",
invalidHandler: function (e, validator) {
var errores = validator.numberOfInvalids();
if (errores > 0) {
$("divDatosFacturaVehiculo.error").show();
} else {
$("divDatosFacturaVehiculo.error").hide();
}
},
rules: {
ctl00$phContenidos$tbMatricula: {
required: true,
minlength: 4
},
ctl00$phContenidos$tbBastidorNumero: {
required: {
depends: function (element) {
return !$("#phContenidos_cbBastidor").attr("checked");
}
}
},
ctl00$phContenidos$tbFechaMatriculaOrigen: {
required: true
},
ctl00$phContenidos$ddlDatosFacturaVehiculoTecnicosModelo: {
required: true
},
ctl00$phContenidos$tbDatosFacturaVehiculoTecnicosClasificacion: {
required: true,
minlength: 4
},
ctl00$phContenidos$tbDatosFacturaVehiculoTecnicosMMA: {
required: true,
number: true
},
ctl00$phContenidos$tbDatosFacturaVehiculoTecnicosCilindrada: { number: true },
ctl00$phContenidos$tbDatosFacturaVehiculoTecnicosTara: { number: true },
ctl00$phContenidos$tbDatosFacturaVehiculoTecnicosPotenciaReal: { number: true },
ctl00$phContenidos$tbDatosFacturaOtrosDatosEjes: { number: true },
ctl00$phContenidos$tbddlDatosFacturaVehiculoTecnicosAsientos: { number: true },
ctl00$phContenidos$tbDatosFacturaVehiculoTecnicosNeumaticos: { number: true },
ctl00$phContenidos$tbatosFacturaVehiculoTecnicosMedNeumaticos: { number: true },
ctl00$phContenidos$tbDatosFacturaVehiculoNKilometros: { number: true },
ctl00$phContenidos$tbDatosFacturaVehiculoTecnicosClasificacion: {
required: true,
minlength: 4
},
ctl00$phContenidos$tbDatosFacturaVehiculoTecnicosCategoria: {
required: true
}
},
submitHandler: function (form) {
bGuardar = true;
$dialogContentVehiculo.dialog("close");
}
});
} else {
bGuardar = false;
$dialogContentVehiculo.dialog("close");
}
},
beforeClose: function (event, ui) {
if (bGuardar) {
var bOK = checkVehiculoAdicionales();
if (bOK) {
actualizarVehiculo();
$("#phContenidos_btnActualizarTotalVehiculo").click();
} else {
return false;
}
}
$("#mainForm").unbind('submit');
}
});
dlg.parent().appendTo(jQuery("form:first"));
dlg.dialog('open');
});}
HERE the jquery name spaced events are explained...
moreover you can do something like this
$("#mainForm").bind("submit.something", function(e){/*...*/});
and wher you are unbinding you can do
$("#mainForm").unbind("submit.something");