Date Picker (Pro feature)
Last updated
Last updated
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:
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.
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.
Calculate hidden by default - If any case hides the element: via the Hidden by Default setting or hidden by some condition, the element's default value (if it is set) will be counted in the formula
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.
Enable Auto-close - Date picker will close automatically when a date is selected
The result of the Date Picker element will be displayed in the total summary.
This setting allows you to add a measuring unit (Ω, cm, kg, inch, etc.) to the field.
Unit Symbol - enter the unit symbol
Position - select the position where the symbol should be displayed relative to the number
Thousands separator - select the the symbol to
Number of decimals - indicate the number of decimals in the fractional part
Decimal separator - select the symbol to separate fractional part
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:
