Set Range Validation to Kendo Datepicker in ASP.NET MVC

Question

I am using Kendo UI ASP.NET MVC with entity Framework 5.0. I have used datepicker of kendo and set validation at model side and successfully fire all the validation except Range. So I want to set the range of datepicker for -7 and +7 days and also disable other dates except -7 and +7 from today.

My code is:

HTML:

@Html.Kendo().DatePickerFor(model => model.MyDate)

Model:

[Required]
        [DataType(DataType.Date)]
        [Range(-7,7,ErrorMessage = "Date must be within -7 to +7 days.")]
        [Display(Name = "My Date")]
        public DateTime? MyDate { get; set; }

I have used above Range validation but not helpful.

Please someone who knows help me solve this problem, thanks in advance.

score 1 · Answer 1 · answered Jun 27 '16 at 20:59

1

Since you are using MVC, you can limit the range of the selectable dates like this:

@(Html.Kendo().DatePicker()
    .Name("datepicker")
    .Min(DateTime.Now.AddDays ( -7 ))
    .Max(DateTime.Now.AddDays ( 7 ))
    .Value(DateTime.Today)
)

And "probably" you should validate on serverside with something like this example.

answered Jun 27 '16 at 20:59

Bakudan

19,134
9
53
73

Yes I was also done this but done server call everytime I want it on client side so this might be not useful for me but yes I can consider it is one of the solution. Thanks Bakudan – 3 rules Jun 28 '16 at 07:33
Thanks for the help dakudan appreciated. – 3 rules Jun 28 '16 at 07:37

score 0 · Accepted Answer · answered Jun 28 '16 at 07:35

gotcha...

I got the solution by doing manually test like below and got the solution:

HTML:

@Html.Kendo().DatePickerFor(model => model.MyDate).Name("Mydatepicker")

Script:

$(document).ready(function () {

    var datefilter = new Date();
    var mindate = new Date();
    mindate.setDate(datefilter.getDate() - 7);
    var maxdate = new Date();
    maxdate.setDate(datefilter.getDate() + 7)

 $("#Mydatepicker").kendoDatePicker({
            max: new Date(maxdate),
            min: new Date(mindate)
        });
});

Set Range Validation to Kendo Datepicker in ASP.NET MVC

2 Answers2