5

Estou tentando comparar duas datas vindas de campos text, transformando-as em objeto Date, da seguinte forma (a primeira função é pra formatar o campo input com 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>
<input type="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">

Mas não está dando certo. Acho que pode ser pelo formato que chega do input, mas não tenho certeza. Dei uma pesquisada no SOen e existem várias perguntas com muitas respostas, mas nenhuma das que vi conseguiu resolver pra mim.

Basicamente, preciso que quando a pessoa acabe de digitar (antes de clicar no botão enviar) retorne um alert caso a data final seja menor que a inicial. Alguma luz?

1 Resposta 1

3

Sugiro mudares no HTML para onkeypress pois dessa maneira o valor do input é passado à função com a a ultima tecla. Com onkeypress o value ainda não tem o novo numero.

No JavaScript podes fazer assim:

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");
}

Exemplo: http://jsfiddle.net/3z247n2o/

Uso uma função para converter essa string em data:

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

e depois comparo com a lógica que já tinhas:

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

Se quiseres usar a função verificar() integrada na noutro código de validação da form podes usar assim, dando return true ou 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;
}
1
  • 1
    Esse script me ajudou muito mesmo, obrigado @Sergio. Commented 20/03/2019 às 14:00

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .