Disable by days of weeks AND by a list of specified dates.

[Masa]

Is there any way to disable date by both?  Such as to disable it by all Tuesdays and Thursdays in addition to by a list of specific dates recorded in the database?

I see it how to disable date picker by days of weeks or by a list of specific dates at the demo.   I found the example of the way to disable weekends and dates specified(holidays). But the not finding a solution for the case that I need it to be implemented.

Thank you.

[Georgi]

Hello Masa,

A possible solution is to pass a handler to the DisableDates setting and return true for the dates that should be disabled.

e.g.

@(Html.Kendo().DatePicker().Name("picker").DisableDates("handler"))

<script>
    var datesFromDataBase = [new Date(2018,9,15)]
    function handler(x) {
        if (x) {
            return x.getDay() === 1 || datesFromDataBase.indexOf(x) > 0; //disable mondays and the dates from the array
        }
    }
</script>

Regards,
Georgi
Progress Telerik

[Masa]

Thank you for your response. The below code will get Tuesdays and Thursdays disabled but not the specific dates (11/10/2018, 11/11/2018 and 11/12/2018)  Am I missing anything?

@(Html.Kendo().DatePicker()

    .Name("Date1")
    .Value(Model.Date1)
    .DisableDates("handler")                                         
)

<script>

    var datesFromDataBase = [new Date(2018, 10, 10), new Date(2018, 10, 11), new Date(2018, 10, 12)]
 
    function handler(x) {
        if (x) {
            return x.getDay() === 2 || x.getDay() === 4 || datesFromDataBase.indexOf(x) > 0; 
        }
    }

</script>

[Georgi]

Hi Masa,

Indeed the current implementation will not work as the dates are actually objects. A possible solution is to map them to strings,

e.g.

@(Html.Kendo().DatePicker()

        .Name("Date1")
        .DisableDates("handler")
)

<script>

    var datesFromDataBase = [new Date(2018, 10, 10), new Date(2018, 10, 11), new Date(2018, 10, 12)];
    var mapedDates = datesFromDataBase.map(x => x.toString());

    function handler(x) {
        if (x) {
            return x.getDay() === 2 || x.getDay() === 4 || mapedDates.indexOf(x.toString()) >= 0;
        }
    }

</script>

Regards,
Georgi
Progress Telerik

[Masa]

Thank you. It works. The below is my code, just in case anyone wants to disable dates from the dates passed as part of a view model.

<script>

    var closedDates = "@string.Join(",", Model.ClosedDates)".split(',').map(x => new Date(x));
    var mappedDates = closedDates.map(x => x.toString());


    function handler(x) {        
        if (x) {
            return x.getDay() === 2 || x.getDay() === 4 || mappedDates.indexOf(x.toString()) >= 0;
        }
    }

</script>