Hey there, i found a solution for this:
Wix doesn’t offer this in the Editor by default, but it can be done easily with a bit of Velo code. You simply use the .enabledDates property of the date picker and pass in an array of allowed dates.
Here’s how it works:
- You create a Date Picker element on your page (e.g.
#datePicker1). - You load the available event dates from your database*(e.g. a collection called
Events), and convert them into JavaScript Date objects. - You set those as the only selectable dates using this line:
$w("#datePicker1").enabledDates = allowedDates;
All other days will automatically be greyed out and can’t be clicked.
No third-party components
No custom calendar needed
Fully native to Wix
Super useful for booking pages where users should only pick from dates that actually have available events!