Search code examples
phpjquerylaraveldatetimepicker

Im using Flatpicker i wanted to disable the past time This is what I have currently


var timewsd = document.getElementById("current_datetime").value ;
            var currentdate = "";





            let roundDate = (date = new Date(timewsd), roundToMinutes = 60) => {
                const ms = 1000 * 60 * roundToMinutes;
                return new Date(Math.ceil(date.getTime() / ms) * ms);
            };

            var current_time = new Date(timewsd).getHours()+":"+new Date(timewsd).getMinutes();

            const date = new Date(timewsd);

            // if(current_time > '16:30'){
            //     currentdate =  setDate(timewsd.getDate() + 1);
            // }else{
            //     currentdate = document.getElementById("current_datetime").value;
            // }



            $("#kt_datepicker_2").flatpickr({
                minDate: "today",
                minuteIncrement: 1,
                enableTime: true,
                minTime :current_time
            });

However when selecting a future date the time limits to the current time for the futiure date too.

https://flatpickr.js.org/examples/


Solution

  • Instead of using minDate: "today" replace it with minDate: new Date() & also remove minTime and you will get your desired output.

    Below, I have provided a live example for your reference.

    <!DOCTYPE html>
    <html>
    <head>
        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/flatpickr/dist/flatpickr.min.css">
    </head>
    <body>
        <h1>Select a Date and Time</h1>
        <input type="text" id="datepicker" placeholder="Select date and time">
        
        <script src="https://cdn.jsdelivr.net/npm/flatpickr"></script>
        <script>
            flatpickr("#datepicker", {
                enableTime: true,
                minuteIncrement: 1,
                minDate: new Date()
            })
        </script>
    </body>
    </html>