Comments (2)
Ok, I've actually figured it out myself 😄
First we get the dates and times in a multidimensional array and JSON encode the array (I'm using PHP, but the logic is still the same no matter what language you use).
$times[]=[
'2022-04-28'=>[
'hour' => 10,
'minute' => 30
]
];
$times[]=[
'2022-04-28'=>[
'hour' => 11,
'minute' => 15
]
];
$times[]=[
'2022-04-29'=>[
'hour' => 13,
'minute' => 30
]
];
$dates=json_encode($times);
And then in our function we loop through the array and do a simple if
statement which says if the date is in the array then to apply a class to that which disables the date 😄
jQuery('#datetimepicker').datetimepicker({
lang:'en',
format:'Y-m-d H:i',
formatDate:'Y-m-d',
step:15,
onGenerate: function(ct, $i){
var date=moment(ct).format('Y-MM-D');
var datesArray=<?echo $dates;?>;
$.each(datesArray, function(i, dates){
if(date in dates){
var times=dates[date];
$.each(times, function(index, time){
var hour=times['hour'];
var minute=times['minute'];
var $object=$('[data-hour="' + hour + '"][data-minute="' + minute + '"]');
$object.addClass('xdsoft_disabled');
});
}
});
}
});
You just have to note that the date format must be the same within the function to whatever it is you have stored in your array. Also, my step is set to 15, which only disables that exact time. You'd need to change this to whatever format you use.
from datetimepicker.
I desperately want this too, but I can't find any way 🙁 I can only disable entire days, which I don't want to do.
from datetimepicker.
Related Issues (20)
- Timepicker is not focusing in preselected value HOT 1
- Flashing flickering input fields on iOS and MAC HOT 1
- highlighted dates setting to null does not remove highlighted dates HOT 1
- Looking for work pleasing older women
- How can I change color settings
- Manual Input for time instead of picker HOT 1
- Appended divs when the page is opened (performance)
- select same time with multiple dates
- enterliketab
- how to preselect/ highlight the next possible date and time instead of today?
- If defaultDate is used, all the allowTimes are disabled
- format with 12h time format (format: m/d/Y h:i A) HOT 4
- Custom highlighted dates
- A white mask appears when selected on an iOS device
- SetDate
- Sev1 Accessibilty bugs, Please looking for solution on these reporetd accessibility bugs.
- input width
- Completely broken now? HOT 1
- If the user selects 31st, in a month and if that date does not exist in the next or previous month or on the UI of the selected month, it skips over that next or previous month
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from datetimepicker.