Hi team,
in the web development we have a requirement like the Calendar should not allow the user to select the dates which are lesser than the current date. They should be disabled.
if today is 07-Feb-2020 then the days before 07-Feb-2020 should be in disabled state.
any one give suggestions on this.
Thanks
Hi Srinivas,
This is possible but not as easy as you might expect. There are events to handle like dragging an event to the disable date or clicking in the disable date. Mostlikely you also want the disabled dates to be visibly disable by having a different background/roreground color
Lets go through all the steps:.
1. Disable dates foreground/background color
To make visible which dates are disabled add an event to your list of events prior to calling ewEventSourceData.
See the screenshot for an example. Start date and end date is the range that should be disabled. You can also add multiple of these events for different ranges. Setting backgroundColor and/or color is then used to show disabled different than selectable dates.
2. Disallow dragging existing events in th disabled dates
For this you need to extend the AdvancedConfig parameter by adding an eventConstraint. What you here define is which dates are available for dragging the events to. Starting at today up to far in the future (i added 100 years, of course you can increase/decrease that).
eventConstraint: { start: '" + FormatDateTime(CurrDate(), "yyyy-MM-dd") + "', " + "end: '" + FormatDateTime(AddYears(CurrDate(), 100), "yyyy-MM-dd") + "'" + "},
3. Disallow creating new events in the disabled dates
For disabling creation of new events you need to extend the AdvancedConfig parameter, and add the selectConstraint:
selectConstraint: { start: '" + FormatDateTime(CurrDate(), "yyyy-MM-dd") + "', " + "end: '" + FormatDateTime(AddYears(CurrDate(), 100), "yyyy-MM-dd") + "'" + "}"
The AdvancedConfig parameter can be found on the Calendar2 widget:
Regards,
Daniel
Daniël Kuhlmann wrote:
Hi Daniel,
Thank you for your suggestion.
Srinivas