I'm pretty new to javascript and jQuery, but I managed to get Trent Richardson's jQuery Timepicker, http://trentrichardson.com/examples/timepicker/ .
I added constraints for limiting dates the user can select, but I now need to change those limits based on the current time. Adding a day if the current time is before 3pm, and adding 2 days if it's after 3pm.
I have it working, but I feel that the code is a little bulky and poorly thought out. Does anyone know if there's a more elegant way of achieving this? Thank in advance :)
var currentTime = new Date()
var hours = currentTime.getHours()
var minutes = currentTime.getMinutes()
if(hours > 15){
//document.write("too late buster!")
$('#datepicker').datetimepicker({
minDate: +2,
maxDate: +30,
dateFormat: "d/M",
timeFormat: 'hh:mm',
hourMin: 11,
hourMax: 19,
hourGrid: 4,
minuteGrid: 10,
stepMinute: 5,
separator: ' @ '});
} else {
$('#datepicker').datetimepicker({
minDate: +1,
maxDate: +30,
dateFormat: "d/M",
timeFormat: 'hh:mm',
hourMin: 11,
hourMax: 19,
hourGrid: 4,
minuteGrid: 10,
stepMinute: 5,
separator: ' @ '});
}
I think I'm right in saying that the only difference is the minDate
property. It's easy to set this conditionally with a ternary expression using the conditional operator :
$('#datepicker').datetimepicker({
minDate: (new Date().getHours() > 15 ? +2 : +1),
maxDate: +30,
dateFormat: "d/M",
timeFormat: 'hh:mm',
hourMin: 11,
hourMax: 19,
hourGrid: 4,
minuteGrid: 10,
stepMinute: 5,
separator: ' @ '});
Here is your code.
var currentTime = new Date()
var hours = currentTime.getHours()
var minutes = currentTime.getMinutes()
if(hours > 15){
//document.write("too late buster!")
$('#datepicker').datetimepicker({
minDate: +2,
maxDate: +30,
dateFormat: "d/M",
timeFormat: 'hh:mm',
hourMin: 11,
hourMax: 19,
hourGrid: 4,
minuteGrid: 10,
stepMinute: 5,
separator: ' @ '});
} else {
$('#datepicker').datetimepicker({
minDate: +1,
maxDate: +30,
dateFormat: "d/M",
timeFormat: 'hh:mm',
hourMin: 11,
hourMax: 19,
hourGrid: 4,
minuteGrid: 10,
stepMinute: 5,
separator: ' @ '});
}
Here is elegant (at least more elegant)
var currentTime = new Date()
var hours = currentTime.getHours()
var minutes = currentTime.getMinutes()
var options = {
minDate: +1,
maxDate: +30,
dateFormat: "d/M",
timeFormat: 'hh:mm',
hourMin: 11,
hourMax: 19,
hourGrid: 4,
minuteGrid: 10,
stepMinute: 5,
separator: ' @ '
}
if (hours > 15) {
options.minDate = +2
}
Then of course pass the options into the timepicker
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.