Date Picker (Pro feature)
With the Pro version of the Cost Calculator Plugin, users are able to add important dates and date ranges to their calculators. To use Date Picker just drag and drop it from the Elements section. Settings will be available by clicking on the element:
Element tab
The Date Picker element has the following attributes in the Element Tab:
Name - Title of the element.
Placeholder - The default input text is shown in the date picker.
Description - Description of the element.
Calendar Option - There are two types of Date picker elements, the first is with range and the second is no range.
Calculate cost per day - Enable if you want to put the price for each day users choose.
Result of the date picker with range.
Make some days unselectable - You can choose days of the week, some periods or days from the current date the user can't choose. For example, if you give consultations and don't work on Mondays and Tuesdays, you can choose these days and restrict users from picking this date.
Settings tab
The Date Picker element has the following attributes in the Settings Tab:
Required - Enable to make a date picking a required action.
Hidden by Default - The element will be hidden until a corresponding condition is met.
Additional Classes - Add extra classes to the HTML elements to further style changes.
Show in Grand Total - Disable if you want to hide the element in Grand Total.
The result of the Date Picker element will be displayed in the total summary.
How to restrict users from choosing the specific days(Examples)
1) For example, you are a dentist. And you give consultations and don't work on Mondays and Tuesdays, you can choose these days and restrict users from picking this date.
That is how it will look on the user’s page:
2) Image you have a graphic design agency. Your team has three days off from 25 -27 December, so you make these days unselectable.
That is how it will look on the user’s page:
3) Let’s take an example of a Veterenary clinic. You can set up the date picker so that users won’t be able to select all previous days, current day and some days after the current day(the date users make an appointment and calculate).
That is how it will look on the user’s page:
Last updated
