Debes tomar los valores de ambos inputs, y utilizarlos para obtener sus respectivas fecha mediante el objecto Date y utilizar el metodo valueOf() para pasarla a milisegundos, con eso ya sabras cual es mayor. Aqui tienes un ejemplo:
Primero creamos nuestra variable ValFec en formato objecto literal, que se encargara de calcular la fecha:
Ahora creamos una propiedad llamada init, que lo que hara es agregar un evento al segundo input, de tipo blur, asi que cuando este evento ocurra, realizara la validacion:
init: function() {
ValFec.inputTags = document.getElementsByTagName("input");
if (document.addEventListener) {
ValFec.inputTags[1].addEventListener("blur", ValFec.validate, false);
} else if (document.attachEvent) {
ValFec.inputTags[1].attachEvent("onblur", ValFec.validate);
}
},
y finalmente creamos la propiedad validate que sera la funcion que se encargara de ver que fecha es mayor
validate: function(evt) {
var fechaInicio = ValFec.inputTags[0].value;
var fechaFin = ValFec.inputTags[1].value;
fechaInicio = fechaInicio.split('/');
fechaFin = fechaFin.split('/');
fechaInicio = new Date(fechaInicio[0], fechaInicio[1] - 1, fechaInicio[2]).valueOf();
fechaFin = new Date(fechaFin[0], fechaFin[1] - 1, fechaFin[2]).valueOf();
if (fechaInicio > fechaFin) {
alert("Fecha inicial es mayor, fatal error.");
}
}
Listo, una vez creado nuestro objecto con todo este codigo, solo habra que llamarlo mediante el window.onload
window.onload = function() {
ValFec.init();
};
Mi mark-up html que utilice de prueba fue el siguiente:
<body>
<span>Fecha Inicio:</span><input type="text" value="2010/05/03" />
<span>Fecha Fin:</span><input type="text" value="2009/12/27" />
</body>
