InputDate
InputDate
Validation
This sample shows how to use ItemValidator function to determine whether dates
are valid for selection and typing.
Features
Use this InputDate control to select a date. Notice that you won't be able to select or type weekends.
The following sample checks invalid date using InvalidInput event.
Description
This sample shows how to use ItemValidator function to determine whether dates
are valid for selection and typing.
It also show how to use InvalidInput event to check invalid date and keep focus for correcting it.
It also show how to use InvalidInput event to check invalid date and keep focus for correcting it.
1 2 3 4 5 6 7 8 9 10 11 12 | using System.Web.Mvc; namespace MvcExplorer.Controllers { public partial class InputDateController : Controller { public ActionResult Validation() { return View(); } } } |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 | @ { var today = DateTime.Now.Date; var minDate = new DateTime(today.Year, 1, 1); var maxDate = new DateTime(today.Year, 12, 31); } @section Scripts{ < style > .invalid-tooltip { background-color: red; color: yellow; opacity: 0.9; border-color: lightcoral; } </ style > <script> var _invalidTooltip; c1.documentReady( function () { _invalidTooltip = new wijmo.Tooltip(); _invalidTooltip.cssClass = 'invalid-tooltip' ; _invalidTooltip.position = 11; window.addEventListener( 'resize' , function () { if (_invalidTooltip.isVisible) { _invalidTooltip.hide(); onInvalidInput(); } }); }) function onInvalidInput(input, e) { e && (e.cancel = true ); _invalidTooltip.show( "#invalidInput" , "@Html.Raw(Resources.InputDate.Validation_Text4)" ); } function onValueChanged(input, e) { _invalidTooltip.hide(); } function itemValidator(date) { var weekday = date.getDay(); return weekday != 0 && weekday != 6; } </script> } < div > < P > @Html .Raw(Resources.InputDate.Validation_Text0)</ P > @ (Html.C1().InputDate().Value(today).Min(minDate).Max(maxDate).ItemValidator( "itemValidator" )) < p ></ p > < p > @Html .Raw(Resources.InputDate.Validation_Text3)</ p > @ (Html.C1().InputDate().Id( "invalidInput" ) .Value(today).Min(minDate).Max(maxDate) .OnClientInvalidInput( "onInvalidInput" ) .OnClientValueChanged( "onValueChanged" ) ) </ div > @section Description{ @Html .Raw(Resources.InputDate.Validation_Text1) < br /> @Html .Raw(Resources.InputDate.Validation_Text2) } |