简体   繁体   中英

Validate JQuery UI Datepicker + Timepicker Addon

I need to validate my datepicker + datetimepicker for these situations:

  • selfinput over maxdaterange

  • selfinput over mindaterange

  • invalid input for not existing date (like 29.02.2017)

  • invalid input (like 214124.123123.2017 (DD.MM.YYYY))

My JS:

    var input = $('<input placeholder="DD.MM.JJJJ HH:MM" type="text">')

input.appendTo($(element));

//DATETIMEPICKER ALLGEMEIN
input.datetimepicker({
    monthNames: ['Januar', 'Februar', 'M&auml;rz', 'April', 'Mai', 'Juni', 'Juli', 'August', 'September', 'Oktober', 'November', 'Dezember'],
    monthNamesShort: ['Januar', 'Februar', 'M&auml;rz', 'April', 'Mai', 'Juni', 'Juli', 'August', 'Septem.', 'Oktober', 'Novem.', 'Dezem.'],
    dayNames: ['Sonntag', 'Montag', 'Dienstag', 'Mittwoch', 'Donnerstag', 'Freitag', 'Samstag'],
    dayNamesMin: ['So', 'Mo', 'Di', 'Mi', 'Do', 'Fr', 'Sa'],
    dateFormat: 'dd.mm.yy',
    changeMonth: false,
    changeYear: true,
    yearRange: '2015:2019',
    showButtonPanel: true,
    timeText: 'Zeit',
    hourText: 'Stunde',
    minuteText: 'Minute',
    secondText: 'Sekunde',
    ampm: false,
    controlType: 'select',
    oneLine: true,
    timeFormat: 'H:mm',
    closeText: "Fertig",
    currentText: "Jetzt"
});

EDIT: If the date is invalid, I need an alert (For example:"Invalid input")

I got it btw, i used the moment.js library and added this code, it prevents everything i wanted without "alert" but it works well and is easy to use!

var previousDate;

input.focus(function () {
    previousDate = $(this).val();;
});
input.blur(function () {
    var newDate = $(this).val();
    if (!moment(newDate, 'DD/MM/YYYY', true).isValid()) {
        $(this).val(previousDate);
        console.log("Error");
    }

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM