New to Telerik UI for ASP.NET MVC? Download free 30-day trial

Date Editing

The Telerik UI DateInput for ASP.NET MVC exposes several configuration methods that allow you to control the behavior of the component when a user edits the date.

Auto-Switch Parts

The following example demonstrates how to enable switching to the next segment of the date automatically when a valid input is set with the AutoSwitchParts configuration method.

    @(Html.Kendo().DateInput()
        .Name("dateinput")
        .AutoSwitchParts(true)
    )

Auto-Switch Keys

The AutoSwitchKeys configuration enables you to set up custom symbols that switch to the next segment of the date when entered.

    @(Html.Kendo().DateInput()
        .Name("dateinput")
        .AutoSwitchKeys(new string[]{"+"})
    )

Mouse Wheel

When set to true, the EnableMouseWheel setting allows the user to change the selected date segment by scrolling the mouse wheel.

    @(Html.Kendo().DateInput()
        .Name("dateinput")
        .EnableMouseWheel(true)
    )

Auto-Correct

The AutoCorrect configuration turns on or off auto-correct of the date segments.

    @(Html.Kendo().DateInput()
        .Name("dateinput")
        .AutoCorrect(true)
    )

Steps

The following example demonstrates how to configure the step change for each date segment when the user navigates with the mouse wheel or the keyboard arrows. Based on the preferred format of the DateInput's date, the available Step configurations are Year, Month, Day, Minute, Second, and Millisecond.

    @(Html.Kendo().DateInput()
        .Name("dateinput")
        .Steps(steps=>{
            steps.Year(4);
            steps.Month(6);
            steps.Day(14);
        })
    )

See Also

In this article