Validate dass Enddatum größer als Datum beginnen mit jQuery

Question

Wie kann ich überprüfen/in jQuery bestätigen, ob Enddatum [Textbox] größer ist als Datum beginnen [Textbox]?

Answer 1

einfach erweitern off-Fusionen. Diese Erweiterungsmethode funktioniert mit dem jQuery validate-Plugin. Es wird validieren Daten und Zahlen

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

es zu benutzen:

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

oder

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

Answer 2

Wenn das Format korrekt YYYY/MM/DD und genau das gleiche sein zwischen den beiden Feldern gewährleistet ist, dann können Sie verwenden:

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

Als String-Vergleich

Answer 3

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

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

Das sollte es tun ich denke,

Answer 4

die Datumswerte aus den Textfelder können durch jQuerys .val() Methode wie

geholt werden 210

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

Ich würde dringend empfehlen, die Datumszeichenfolgen vor dem Vergleich zu analysieren. Das Javascript-Date-Objekt hat eine parse() - Methode, unterstützt aber nur US-Datumsformate (JJJJ/MM/TT). Es gibt die Millisekunden seit Beginn der Unix-Epoche zurück, so dass Sie Ihre Werte einfach mit> oder < vergleichen können.

Wenn Sie verschiedene Formate (zum Beispiel ISO 8661) wollen, müssen Sie reguläre Ausdrücke oder die freie date.js Bibliothek zurückgreifen.

Wenn Sie super benutzerfreundlich sein wollen, können Sie jquery ui datepickers statt textfields verwenden. Es gibt eine Datumsauswahl-Variante, die Datumsbereiche eingeben können:

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

Answer 5

Referenz jquery.validate.js und jquery-1.2.6.js. Fügen Sie Ihrem Startdatum-Textfeld eine startDate-Klasse hinzu. Fügen Sie der Enddatums-Textbox eine endDate-Klasse hinzu.

dieses Skript Block zu Ihrer Seite hinzufügen: -

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

Hoffnung hilft dies :-) antworten

Answer 6

Ich mag, was Franz sagte, weil das, was ich bin mit: 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; 
} 

Answer 7

Ich bastelte gerade mitundfestgestellt, dass während gut gemeinten, leider ist es auf mehreren Browsern gebrochen, die nicht IE sind. Dies liegt daran, IE wird ziemlich streng sein, was es als Argument für die Date Konstruktor akzeptiert, aber andere nicht. Zum Beispiel Chrome 18 gibt

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

Dieser den Code bewirkt, dass die „Daten vergleichen“ Weg zu nehmen und es geht alles bergab von dort (znew Date("11") ist größer als new Date("66") und dies ist offensichtlich das Gegenteil des gewünschten Effekts).

Daher habe ich den Code geändert, um dem "Zahlen" -Pfad über den "Datums" -Pfad Priorität einzuräumen und zu bestätigen, dass die Eingabe tatsächlich numerisch ist, mit der ausgezeichneten Methode, die in Validate decimal numbers in JavaScript - IsNumeric() bereitgestellt wird.

Am Ende wird der Code:

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

Answer 8

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

Hope this helfen :)

Answer 9

Also brauchte ich diese Regel optional zu sein und keine der oben genannten Vorschläge sind optional. Wenn ich die Methode anrufe, wird sie wie gewünscht angezeigt, auch wenn ich sie auf einen Wert setze.

Das ist mein Aufruf:

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

Mein addMethod ist nicht so robust wie Mike E. Top bewertete Antwort, aber ich bin mit dem jQueryUI picker einer aktuellen Auswahl zu erzwingen. Wenn jemand kann mir sagen, wie man sicherstellen, dass die Daten sind Zahlen sein und haben das Verfahren optional das wäre toll, aber jetzt diese Methode funktioniert für mich:

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

Answer 10

wenig spät zur Party, aber hier ist mein Teil

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

Hier ist das Detail:

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

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

Answer 11

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

oder Besuch dieser link

Answer 12

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

Answer 13

In Javascript/jquery die meisten der Entwickler verwendet Von & Bisher Vergleich die Zeichenfolge ist, ohne in das Datumsformat zu konvertieren. Der einfachste Weg zum Vergleich von Datum ist größer als bis heute ist.

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

analysieren immer aus und bisher vor dem Vergleich zu genauen Ergebnissen