CODEWITHSUNDEEP
jquerydatetimepicker
nsilva
nsilva

Reputation: 5614

jQuery - DateTimePicker - Make time required to remove the current time

So I am using jQuery DateTimePicker, currently I have the following settings:

  jQuery(document).ready(function($) {

    jQuery.datetimepicker.setLocale('en');

    jQuery('#datepicker').datetimepicker({
        beforeShowDay: $.datepicker.noWeekends,
        format: 'd/m/Y H:i a',
        minDate: 0,             
        minTime: 0,
        step: "30",
         allowTimes:[
          '09:00', '09:30', '10:00', '10:30', '11:00', '11:30', '12:00', '12:30',
          '13:00', '13:30', '14:00', '14:30', '15:00', '15:30', '16:00', '16:30', '17:00'
         ]              
    });         

  });

As you can see, you can't select a date or time in the past and the time selection is only 9-5pm on weekdays...

This issue I have is that if I just select today's date, it put's in the date with the current time stamp, I need to somehow round this up to the next 30 minute increment or make the time selection required as well as the date.

Any ideas?

Upvotes: 2

Views: 766

Answers (2)

nsilva
nsilva

Reputation: 5614

Okay, I managed to find a solution in the end, here is the updated code:

I've also made some further changes so today's date is not selectable if it's outside the allowTimes.

Since it puts the current time as well, I've also set it so if you select a date in the future, it will set the time to '09:00' which is the first available time within the allowTimes:

    var checkPastTime = function(currentDateTime) {

    var d = new Date();
    var todayDate = d.getDate();


    if (currentDateTime.getDate() == todayDate) { // check today date
        this.setOptions({               
            minTime: d.getHours() + '1:00' //here pass current time hour                        ;
        });
    } else
        this.setOptions({
            minTime: false
        });

    if(currentDateTime.getDate() == todayDate && d.getHours() >= 17) {
        this.setOptions({               
            minDate:'+1970/01/02',
            minTime: '09:00',
            defaultTime: '09:00'
        });     
    }   

    };

  jQuery(document).ready(function($) {

    jQuery.datetimepicker.setLocale('en'); 

    var d = new Date();
    var todayDate = d.getDate();


    if(todayDate == d.getDay() + 1) {
        var ahead = d.getHours() + 1;
    } else {
        var ahead = '9';
    }

    jQuery('#datepicker').datetimepicker({
        //beforeShowDay: $.datepicker.noWeekends,
        format: 'd/m/Y H:i a',
        minDate: 0, 
        onChangeDateTime: checkPastTime,
        onShow: checkPastTime, 
        defaultTime: ahead + ':00',
        step: "30",
         allowTimes:[
          '09:00', '09:30', '10:00', '10:30', '11:00', '11:30', '12:00', '12:30',
          '13:00', '13:30', '14:00', '14:30', '15:00', '15:30', '16:00', '16:30', '17:00'
         ]              
    });         

  });

Upvotes: 2

step
step

Reputation: 2410

Use this code:

var currentDate = new Date();
var minutes = currentDate.getMinutes();
var m = (Math.ceil(minutes/30) * 30) % 60;
currentDate.setMinutes(m);

and then set currentDate into your datetimepicker as defaultDate or some method setDate

Upvotes: 0

Related Questions