How to compare two dates in Javascript or jQuery

5

I'm trying to compare two dates coming from fields text , turning them into object Date , as follows (the first function is to format the field input with XX/XX/XXXX ):

function formatar(mascara, documento){
    var i = documento.value.length;
    var saida = mascara.substring(0,1);
    var texto = mascara.substring(i);
    if (texto.substring(0,1) != saida){
        documento.value += texto.substring(0,1);
    }
}

if(new Date('#datafinal') <= new Date('#datainicial'))
{

alert("A data inicial é maior que a data final");
  
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><inputtype="text" maxlength="10" placeholder="dd/mm/aaaa"
                       OnKeyPress="formatar('##/##/####', this)" id="datainicial">
<br>
                <input type="text" maxlength="10" placeholder="dd/mm/aaaa"
                       OnKeyPress="formatar('##/##/####', this)" id="datafinal">

But it's not working. I think it could be by the format that comes from input , but I'm not sure. I've researched SOen and #, but none of the ones I saw succeeded in doing so. solve it for me.

Basically, I need when the person finishes typing (before clicking the submit button) return a alert if the end date is less than the initial date. Any light?

    
asked by anonymous 07.06.2015 / 01:11

1 answer

3

I suggest you change the HTML to onkeypress because in this way the value of the input is passed to the function with the last key. With onkeypress value does not yet have the new number.

In JavaScript you can do this:

var datainicial = document.getElementById('datainicial');
var datafinal = document.getElementById('datafinal');

function formatar(mascara, documento) {
    var i = documento.value.length;
    var saida = mascara.substring(0, 1);
    var texto = mascara.substring(i);
    if (texto.substring(0, 1) != saida) {
        documento.value += texto.substring(0, 1);
    }
    verificar();
}

function gerarData(str) {
    var partes = str.split("/");
    return new Date(partes[2], partes[1] - 1, partes[0]);
}

function verificar() {
    var inicio = datainicial.value;
    var fim = datafinal.value;
    if (inicio.length != 10 || fim.length != 10) return;

    if (gerarData(fim) <= gerarData(inicio)) alert("A data inicial é maior que a data final");
}

Example: link

I use a function to convert this string to date:

function gerarData(str) {
    var partes = str.split("/");
    return new Date(partes[2], partes[1] - 1, partes[0]);
}

and then compare to the logic you already had:

if (gerarData(fim) <= gerarData(inicio))

If you want to use the verificar() function integrated in another validation code of the form you can use this, giving return or false :

>
function verificar() {
    var inicio = datainicial.value;
    var fim = datafinal.value;
    if (inicio.length != 10 || fim.length != 10) return false;

    if (gerarData(fim) > gerarData(inicio)) return true;
    alert("A data inicial é maior que a data final");
    return false;
}
    
07.06.2015 / 01:28