Valide se a data de término é maior que a data de início com jQuery

Como faço para verificar / validar no jQuery se a data de término [caixa de texto] é maior que a data de início [caixa de texto]?

Apenas expandindo a resposta das fusões. este método de extensão funciona usando o plugin de validação jQuery. Vai validar datas e números

jQuery.validator.addMethod("greaterThan", 
function(value, element, params) {

    if (!/Invalid|NaN/.test(new Date(value))) {
        return new Date(value) > new Date($(params).val());
    }

    return isNaN(value) && isNaN($(params).val()) 
        || (Number(value) > Number($(params).val())); 
},'Must be greater than {0}.');

Para usá-lo:

$("#EndDate").rules('add', { greaterThan: "#StartDate" });

ou

$("form").validate({
    rules: {
        EndDate: { greaterThan: "#StartDate" }
    }
});

var startDate = new Date($('#startDate').val());
var endDate = new Date($('#endDate').val());

if (startDate < endDate){
// Do something
}

Isso deve bastar, eu acho

Um pouco tarde para a festa, mas aqui é a minha parte

Date.parse(fromDate) > Date.parse(toDate)

Aqui está o detalhe:

var from = $("#from").val();
var to = $("#to").val();

if(Date.parse(from) > Date.parse(to)){
   alert("Invalid Date Range");
}
else{
   alert("Valid date Range");
}

Consulte jquery.validate.js e jquery-1.2.6.js. Adicione uma classe startDate à sua caixa de texto da data de início. Adicione uma classe endDate à sua caixa de texto de data de término.

Adicione este bloco de script à sua página: -

<script type="text/javascript">
    $(document).ready(function() {
        $.validator.addMethod("endDate", function(value, element) {
            var startDate = $('.startDate').val();
            return Date.parse(startDate) <= Date.parse(value) || value == "";
        }, "* End date must be after start date");
        $('#formId').validate();
    });
</script>

Espero que isto ajude :-)

Eu estava apenas brincando com a resposta de danteuno e descobri que, embora seja bem-intencionado, infelizmente está quebrado em vários navegadores que não são o IE. Isso ocorre porque o IE será bastante rígido sobre o que aceita como argumento para o Dateconstrutor, mas outros não. Por exemplo, o Chrome 18 oferece

> new Date("66")
  Sat Jan 01 1966 00:00:00 GMT+0200 (GTB Standard Time)

Isso faz com que o código tome o caminho de "comparar datas" e tudo desmorone a partir daí (por exemplo, new Date("11")é maior que new Date("66")e isso é obviamente o oposto do efeito desejado).

Portanto, após consideração, modifiquei o código para dar prioridade ao caminho "números" sobre o caminho "datas" e validar se a entrada é realmente numérica com o excelente método fornecido em Validar números decimais em JavaScript - IsNumeric () .

No final, o código se torna:

$.validator.addMethod(
    "greaterThan",
    function(value, element, params) {
        var target = $(params).val();
        var isValueNumeric = !isNaN(parseFloat(value)) && isFinite(value);
        var isTargetNumeric = !isNaN(parseFloat(target)) && isFinite(target);
        if (isValueNumeric && isTargetNumeric) {
            return Number(value) > Number(target);
        }

        if (!/Invalid|NaN/.test(new Date(value))) {
            return new Date(value) > new Date(target);
        }

        return false;
    },
    'Must be greater than {0}.');

Os valores de data dos campos de texto podem ser obtidos pelo método jquery .val (), como

var datestr1 = $('#datefield1-id').val();
var datestr2 = $('#datefield2-id').val();

Eu recomendo fortemente que você analise as strings de data antes de compará-las. O objeto Date do Javascript tem um método parse () -, mas suporta apenas formatos de data dos EUA (AAAA / MM / DD). Ele retorna os milissegundos desde o início da época unix, então você pode simplesmente comparar seus valores com> ou <.

Se você quiser formatos diferentes (por exemplo, ISO 8661), você precisa recorrer a expressões regulares ou à biblioteca date.js gratuita.

Se você quiser ser super amigável ao usuário, pode usar jquery ui datepickers em vez de textfields. Existe uma variante do selecionador de data que permite inserir intervalos de datas:

http://www.filamentgroup.com/lab/date_range_picker_using_jquery_ui_16_and_jquery_ui_css_framework/

Portanto, eu precisava que essa regra fosse opcional e nenhuma das sugestões acima é opcional. Se eu chamar o método, ele será exibido como necessário, mesmo se eu configurá-lo para precisar de um valor.

Esta é a minha chamada:

  $("#my_form").validate({
    rules: {
      "end_date": {
        required: function(element) {return ($("#end_date").val()!="");},
        greaterStart: "#start_date"
      }
    }
  });//validate()

Minha addMethodresposta não é tão robusta quanto a de Mike E., mas estou usando o selecionador de data JqueryUI para forçar uma seleção de data. Se alguém puder me dizer como ter certeza de que as datas são números e ter o método opcional, isso seria ótimo, mas por enquanto este método funciona para mim:

jQuery.validator.addMethod("greaterStart", function (value, element, params) {
    return this.optional(element) || new Date(value) >= new Date($(params).val());
},'Must be greater than start date.');

Em javascript / jquery, a maioria do desenvolvedor usa comparação de datas De & Até, que é uma string, sem converter para o formato de data. A maneira mais simples de comparar a partir da data é maior do que a data atual.

Date.parse(fromDate) > Date.parse(toDate)

Sempre analise desde e até a data antes da comparação para obter resultados precisos

Gosto do que o Franz disse, porque é o que estou usando: P

var date_ini = new Date($('#id_date_ini').val()).getTime();
var date_end = new Date($('#id_date_end').val()).getTime();
if (isNaN(date_ini)) {
// error date_ini;
}
if (isNaN(date_end)) {
// error date_end;
}
if (date_ini > date_end) {
// do something;
}

$(document).ready(function(){
   $("#txtFromDate").datepicker({
        minDate: 0,
        maxDate: "+60D",
        numberOfMonths: 2,
        onSelect: function(selected) {
          $("#txtToDate").datepicker("option","minDate", selected)
        }
    });

    $("#txtToDate").datepicker({
        minDate: 0,
        maxDate:"+60D",
        numberOfMonths: 2,
        onSelect: function(selected) {
           $("#txtFromDate").datepicker("option","maxDate", selected)
        }
    });
});

Ou visite este link

jQuery('#from_date').on('change', function(){
    var date = $(this).val();
    jQuery('#to_date').datetimepicker({minDate: date});  
});

function endDate(){
    $.validator.addMethod("endDate", function(value, element) {
      var params = '.startDate';
        if($(element).parent().parent().find(params).val()!=''){
           if (!/Invalid|NaN/.test(new Date(value))) {
               return new Date(value) > new Date($(element).parent().parent().find(params).val());
            }
       return isNaN(value) && isNaN($(element).parent().parent().find(params).val()) || (parseFloat(value) > parseFloat($(element).parent().parent().find(params).val())) || value == "";              
      }else{
        return true;
      }
      },jQuery.format('must be greater than start date'));

}

function startDate(){
            $.validator.addMethod("startDate", function(value, element) {
            var params = '.endDate';
            if($(element).parent().parent().parent().find(params).val()!=''){
                 if (!/Invalid|NaN/.test(new Date(value))) {
                  return new Date(value) < new Date($(element).parent().parent().parent().find(params).val());
            }
           return isNaN(value) && isNaN($(element).parent().parent().find(params).val()) || (parseFloat(value) < parseFloat($(element).parent().parent().find(params).val())) || value == "";
                 }
                        else{
                     return true;
}

    }, jQuery.format('must be less than end date'));
}

Espero que isso ajude :)

Primeiro você divide os valores de duas caixas de entrada usando a função de divisão. em seguida, concate o mesmo na ordem inversa. após a concat nação, analise-o para um inteiro. em seguida, compare dois valores na instrução if. Ex. 1> 20-11-2018 2> 21-11-2018

após dividir e concatar novos valores para comparação 20181120 e 20181121 e depois comparar os mesmos.

var date1 = $('#datevalue1').val();
var date2 = $('#datevalue2').val();
var d1 = date1.split("-");
var d2 = date2.split("-");

d1 = d1[2].concat(d1[1], d1[0]);
d2 = d2[2].concat(d2[1], d2[0]);

if (parseInt(d1) > parseInt(d2)) {

    $('#fromdatepicker').val('');
} else {

}

isso deve funcionar

$.validator.addMethod("endDate", function(value, element) {
            var startDate = $('#date_open').val();
            return Date.parse(startDate) <= Date.parse(value) || value == "";
        }, "* End date must be after start date");

Se houver garantia de que o formato está correto AAAA / MM / DD e exatamente o mesmo entre os dois campos, você pode usar:

if (startdate > enddate) {
   alert('error'
}

Como uma comparação de string