Überprüfen Sie, ob Datum in der Vergangenheit ohne Absenden

Habe ich diesen code möchte ich prüfen ob ein Datum in der Vergangenheit liegt. Ich will es prüfen, sobald das Datum eingegeben wird, vor der form der Einreichung.

<input id="datepicker" onchange="checkDate()" required class="datepicker-input" type="text" data-date-format="yyyy-mm-dd" >

<script type="text/javascript">
 function checkDate() {
   var selectedDate = document.getElementById('datepicker').value;
   var now = new Date();
   if (selectedDate < now) {
    alert("Date must be in the future");
   }
 }
</script>

Funktioniert das nicht, wenn ich geben Sie ein Datum in der Vergangenheit (z.B. 2014-12-03) es wird nicht angezeigt der Alarm.

  • weil ein string, kein Datum.
  • Die Eingabe wird in diesem format, obwohl yyyy-mm-dd
  • Und das ist immer noch ein string, kein Datum. Der Eingabewert ist nicht ein Date-Objekt.
  • oh, ok. wie kann ich es konvertieren?
  • Haben Sie in Betracht gezogen, Zeitzonen, btw oder einfach nur, dass die Tatsache, dass die Benutzer ändern Ihre OS-Uhr aus irgendeinem Grund ? 🙂
  • Ich habe server-seitige Validierung bereits umgesetzt. Aber ich möchte Echtzeit-Validierungs-als auch @ThongKuah
  • Irgendeine Idee, über diese Frage stackoverflow.com/questions/42062690/...

InformationsquelleAutor Alex | 2014-12-31
  1. 14

    Alles, was Sie tun müssen, konvertieren Sie die Zeichenfolge erzeugt, die durch die <input> in ein Datum mit der Date-Konstruktor new Date("2014-06-12")

    JS:

     function checkDate() {
   var selectedText = document.getElementById('datepicker').value;
   var selectedDate = new Date(selectedText);
   var now = new Date();
   if (selectedDate < now) {
    alert("Date must be in the future");
   }
 }

    HTML:

    <input id="datepicker" onchange="checkDate()" required class="datepicker-input" type="date" data-date-format="yyyy-mm-dd" >

    • Es funktioniert nicht. Aber es scheint, das Problem ist etwas anderes. Auch wenn ich, dies zu tun: $("#datepicker").change(function() { alert( "test" ); }); alert nicht zeigen
    • Es ist für mich arbeiten? Versuchen Sie 2014-06-12 in das Feld ein und drücken Sie die EINGABETASTE (Sie müssen enter drücken, oder ändern Sie den Fokus von der Steuerung zum auslösen des onchange-Ereignis)
    • ah ok. Ich entfernt den Datum-picker-plugin und es hat funktioniert. Wie kann ich es machen das arbeiten mit der Datum-picker-plugin
    • Wenn Sie möchten, verwenden Sie einen Datum-picker plugin, jQuery-UI ein, und dann können Sie minDate und maxDate statt eigene Validierungs-Funktion. Siehe dieses Beispiel
    InformationsquelleAutor Miguel
  2. 1

    Den date() Funktion gibt einen string zurück. Versuchen Sie konvertieren beide Termine Ganzzahlen zuerst mit der Date.parse() Funktion:

    HTML:

    <input id="datepicker" onchange="checkDate()" required class="datepicker-input" type="text" data-date-format="yyyy-mm-dd" >

<script type="text/javascript">
   function checkDate() {
       var selectedDate = document.getElementById('datepicker').value;
       var now = new Date();
       var dt1 = Date.parse(now),
       dt2 = Date.parse(selectedDate);
       if (dt2 < dt1) {
            alert("Date must be in the future");
       }
 }
</script>

    • Es scheint, das Problem ist etwas anderes, auch wenn ich da so machen: $("#datepicker").change(function() { alert( "test" ); }); alert nicht zeigen
    • Ich werde vorschlagen, Sie schauen Sie auf Ihre browser-Konsole; haben Sie vielleicht einen Fehler anderswo
    InformationsquelleAutor che-azeh
  3. 0

    Dein code ist wirklich in der Nähe, versuchen Sie dies statt:

    var selectedDate = $('#datepicker').datepicker('getDate');
var now = new Date();
if (selectedDate < now) {
  //selected date is in the past
}
    • Ich sah dies auf einer anderen post, es hat nicht funktioniert für mich.
    • Bitte versuchen Sie es zu vergleichen, Datum mit getTime-Funktion... if (selectedDate.getTime() < jetzt.getTime()) { ... }
    • Soweit ich weiß, die Lösung hängt davon ab, jQuery UI installiert. Es ist im Grunde die Konvertierung Ihrer input-Feld auf ein datepicker-widget. Es wird funktionieren, aber es ist völlig unnötig.
    InformationsquelleAutor Alex J
  4. 0

    Für diejenigen, die mit Typ="Datum" (eingeführt mit HTML5) statt type="text", können Sie es auf diese Weise getan:

     function checkDate() {
   var date = this.value;
   if(date.valueAsDate <= new Date()) {
       //Date in the past
   } else {
       //Date in the future
   }
}
    InformationsquelleAutor t.m.
  5. 0

    Einfache mine-Funktion arbeiten ...

    function check_not_past_date_time(enter_date) {
    var a =new Date(enter_date);
    var now =new Date();
    if(a>now){
        return true;
    }else {
        return false;
    }
}
    InformationsquelleAutor Mostafa Khedeer
Schreibe einen Kommentar