TagHelper - How to define an array?

1 Answer 192 Views
DateRangePicker
Daniel
Top achievements
Rank 3
Iron
Iron
Iron
Daniel asked on 11 Mar 2022, 10:43 AM | edited on 11 Mar 2022, 10:43 AM

Hey guys,

currently I'm trying to get use of the tag helper in general. Now I'm stuck at the daterangepicker.

Can somebody describe how you can put an array to the definition? I'm talking about the "DisableDates".


Html.Kendo().DateRangePicker()
                        .DisableDates(new[] { "sa", "su" })
                        .Max(DateTime.Now.AddYears(1))
                        .Messages(m => m.StartLabel("Start").EndLabel("Ende"))
                        .Name("daterangepickerReservierungswunsch")
                        .Range(r => r.Start(Model.Startdatum).End(Model.Enddatum))
<kendo-daterangepicker name="daterangeReservation" disable-dates="???" max="DateTime.Now.AddYears(1)" >
                <messages start-label="Start" end-label="Ende" />
                <range start="Model.DateStart" end="Model.DateEnd" />
            </kendo-daterangepicker>

1 Answer, 1 is accepted

Sort by
1
Accepted
Aleksandar
Telerik team
answered on 16 Mar 2022, 06:38 AM

Hi Daniel,

The disable-dates TagHelper configuration expects an array of DataTime objects. So if you want to disable the weekends for selection you can generate an array of dates that will be disabled in a Razor code block and pass the generated array to the disabled-dates configuration option:

@addTagHelper *, Kendo.Mvc
@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers

@{
    IEnumerable<DateTime> GetDaysBetween(DateTime start, DateTime end)
    {
        for (DateTime i = start; i < end; i = i.AddDays(1))
        {
            yield return i;
        }
    }

    var weekends = GetDaysBetween(DateTime.Today, DateTime.Today.AddYears(1))
        .Where(d => d.DayOfWeek == DayOfWeek.Saturday || d.DayOfWeek == DayOfWeek.Sunday).ToArray();
}

<kendo-daterangepicker name="daterangeReservation" disable-dates="weekends" max="DateTime.Now.AddYears(1)" >
                <messages start-label="Start" end-label="Ende" />
                <range start="DateTime.Now" end="DateTime.Now.AddDays(10)"/>
            </kendo-daterangepicker>

Here is a REPL demonstrating the above.

Regards,
Aleksandar
Progress Telerik

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.

Daniel
Top achievements
Rank 3
Iron
Iron
Iron
commented on 16 Mar 2022, 08:20 AM

Thank you sir, it's working!
Tags
DateRangePicker
Asked by
Daniel
Top achievements
Rank 3
Iron
Iron
Iron
Answers by
Aleksandar
Telerik team
Share this question
or