Foundation 5 bleibt bei js und prüft, ob das Datum vor einem anderen Datum liegt
-
21-12-2019 - |
Frage
Ich benutze zurb foundation 5
Und abide js
für die Überprüfung meines Formulars.Ich muss prüfen, ob DATE1
ist vor oder gleich DATE2
Wie kann ich überprüfen, ob es gültig ist? abidejs
?
Lösung
Die kurze Antwort lautet: Sie können Abide dafür nicht wirklich verwenden.Abide erleichtert nicht den Vergleich, den Sie mit den Daten durchführen müssen, um zu überprüfen, ob das eine größer oder gleich dem anderen ist.Einiges benutzerdefiniertes Javascript kann das für Sie erledigen, aber Sie werden feststellen, dass Abide Ihnen die Kontrolle über die Fehlermeldungen streitig macht, was bedeutet, dass Sie Abide ganz ausrangieren und die gesamte Fehlerbehandlung selbst durchführen müssen.
Hier ist eine Illustration dessen, was ich meine:
HTML
<div class="panel">
<form data-abide class="date-form">
<div class="date-1">
<label>Date 1</label>
<input type="date">
<small class="error">This is not a valid date.</small>
</div>
<div class="date-2">
<label>Date 2</label>
<input type="date">
<small class="error">Date 2 must be a valid date and fall on or after date 1.</small>
</div>
<button type="submit">Submit</button>
</form>
</div>
Javascript
//lets do a check when one of the input values has changed
$('.date-form').on('change', '.date-1 input, .date-2 input', function() {
//lets convert our dates to values we can do a comparison with
date1 = Date.parse($('.date-1 input').val());
date2 = Date.parse($('.date-2 input').val());
//lets check that both values are valid numbers
if ($.isNumeric(date1) && $.isNumeric(date2)) {
//lets check if date 2 is not greater or equal to date one and throw an error
if (date1 > date2) {
//we have a problem add error class to date-2 for error message
$('.date-2').addClass('error');
}
}
});
Dies wird mit Abide bekämpft.Hier ist eine Geige, um es zu veranschaulichen http://codepen.io/anon/pen/fiKFc.
Die lange Antwort ist immer noch, dass Sie Abide dafür nicht wirklich verwenden können.Entschuldigung.