ComponentOne MVC Edition's Calendar control has a built-in validator, ItemValidator that lets you control the type of data or the value that users can select from the calendar control. All you need to do is create a validation function, which is assigned to ItemValidator to allow or restrict the selection of dates by the user.
In this example, ItemValidator function is created so that a user can select a weekday, but not Saturdays and Sundays in the calendar control. This kind of validation is useful while planning your work sprints, workout days or diet plan.
The following image shows how the Calendar control appears after applying ItemValidator to it.
The following code example demonstrates how to add ItemValidator in the Calendar control:
Add a new Controller:
Default1Controller
).Calendar.cshtml
HTML |
Copy Code
|
---|---|
@{ var today = DateTime.Now.Date; var minDate = new DateTime(today.Year, 1, 1); var maxDate = new DateTime(today.Year, 12, 31); } <script> function itemValidator(date) { var weekday = date.getDay(); return weekday != 0 && weekday != 6; } </script> <div> <c1-calendar value="@today" min="@minDate" max="@maxDate" item-validator="itemValidator" width="300px"> </c1-calendar> </div>; |