JQuery ile bitiş tarihinin başlangıç ​​tarihinden büyük olduğunu doğrulayın

JQuery'de bitiş tarihinin [metin kutusu] başlangıç ​​tarihinden [metin kutusu] büyük olup olmadığını nasıl kontrol edebilirim / doğrulayabilirim?

Sadece füzyonları genişletmek cevap. bu uzantı yöntemi jQuery validate eklentisini kullanarak çalışır. Tarihleri ​​ve sayıları doğrulayacak

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}.');

Kullanmak için:

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

veya

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

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

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

Bence bunu yapmalı

Partiye biraz geç ama işte benim bölümüm

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

İşte detay:

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

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

Referans jquery.validate.js ve jquery-1.2.6.js. Başlangıç ​​tarihi metin kutunuza bir startDate sınıfı ekleyin. Bitiş tarihi metin kutunuza bir endDate sınıfı ekleyin.

Bu komut dosyası bloğunu sayfanıza ekleyin: -

<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>

Bu yardımcı olur umarım :-)

Sadece danteuno'nun cevabıyla uğraşıyordum ve iyi niyetli olsa da, ne yazık ki IE olmayan birkaç tarayıcıda bozuk olduğunu gördüm . Bunun nedeni, IE'nin kurucuya argüman olarak neyi kabul ettiği konusunda oldukça katı Dateolacak, ancak diğerleri olmayacak. Örneğin, Chrome 18,

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

Bu, kodun "tarihleri ​​karşılaştır" yolunu almasına neden olur ve her şey buradan yokuş aşağı gider (örneğin new Date("11"), daha büyüktür new Date("66")ve bu, istenen etkinin açıkça tersidir).

Bu nedenle, üzerinde düşündükten sonra, "tarihler" yolu üzerinden "sayılar" yoluna öncelik vermek için kodu değiştirdim ve girdinin JavaScript'te ondalık sayıları doğrula - IsNumeric () 'de sağlanan mükemmel yöntemle gerçekten sayısal olduğunu doğruladım .

Sonunda kod şu hale gelir:

$.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}.');

Metin alanlarındaki tarih değerleri jquery'nin .val () Yöntemi ile şu şekilde alınabilir:

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

Tarih dizelerini karşılaştırmadan önce ayrıştırmanızı şiddetle tavsiye ederim. Javascript'in Tarih nesnesinde bir parse () - Yöntem vardır, ancak yalnızca ABD tarih biçimlerini (YYYY / AA / GG) destekler. Unix döneminin başlangıcından bu yana geçen milisaniyeleri döndürür, böylece değerlerinizi> veya <ile karşılaştırabilirsiniz.

Farklı formatlar istiyorsanız (örn. ISO 8661), normal ifadelere veya ücretsiz date.js kitaplığına başvurmanız gerekir.

Süper kullanıcı dostu olmak istiyorsanız, metin alanları yerine jquery ui veri seçici kullanabilirsiniz. Tarih aralıklarının girilmesine izin veren bir tarih seçici varyantı vardır:

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

Bu yüzden bu kuralın isteğe bağlı olmasına ihtiyacım vardı ve yukarıdaki önerilerin hiçbiri isteğe bağlı değil. Yöntemi çağırırsam, onu bir değere ihtiyaç duyacak şekilde ayarlasam bile gerektiği gibi gösteriliyor.

Bu benim çağrım:

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

Benim addMethod, Mike E.'nin en çok oy alan cevabı kadar sağlam değil, ancak bir tarih seçimini zorlamak için JqueryUI tarih seçici kullanıyorum. Birisi bana tarihlerin sayı olduğundan nasıl emin olacağımı ve yöntemin isteğe bağlı olmasını sağlayabilirse bu harika olurdu, ancak şimdilik bu yöntem benim için çalışıyor:

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.');

Javascript / jquery'de geliştiricilerin çoğu, tarih biçimine dönüştürmeden dize olan Başlangıç ​​& Bitiş tarih karşılaştırmasını kullanır. Tarihle karşılaştırmanın en basit yolu bugüne kadarki zamandan daha büyüktür.

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

Doğru sonuçlar elde etmek için her zaman karşılaştırmadan önce ve bugüne kadar ayrıştırın

Franz'ın söylediklerini beğendim çünkü kullandığım şey bu: 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)
        }
    });
});

Veya bu bağlantıyı ziyaret edin

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

Umarım bu yardımcı olur :)

Önce, bölme işlevini kullanarak iki giriş kutusunun değerlerini bölersiniz. sonra aynı şeyi ters sırada birleştirin. concat ulus sonra tam sayıya ayrıştırır. sonra if ifadesindeki iki değeri karşılaştırın. ör. 1> 20-11-2018 2> 21-11-2018

20181120 ve 20181121 karşılaştırması için split ve concat'den sonra yeni değerler aynı şeyi karşılaştırır.

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 {

}

bu çalışmalı

$.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");

Biçimin doğru YYYY / AA / GG olması ve iki alan arasında tam olarak aynıysa, şunları kullanabilirsiniz:

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

Dize karşılaştırması olarak