Edit this page

Enter Date by Setting Only the Day

Environment

Product Progress Kendo UI DatePicker
Progress Kendo UI version Created with version 2018.1.226

 

Description

How can I enter only the day part of the date and let the rest of the DatePicker use the current month and year as default?

Solution

The following example demonstrates how to achieve the desired functionality.

<input id="datepicker" />
<script>
    $(document).ready(function () {
        // create DatePicker from input HTML element
        $("#datepicker").kendoDatePicker();

        $("#datepicker").on("blur", function (e) {
            var rawValue = $(this).val();
            var parsedValue = parseInt(rawValue);

            if (!parsedValue) {
                alert("value is not a valid day");
                return;
            }

            var selectedDate = $(this).getKendoDatePicker().value();

            if (!selectedDate && rawValue.length <= 2 && parsedValue <= 31) {
                var picker = $(this).getKendoDatePicker();
                var date = new Date();
                date.setDate(parsedValue);

                picker.value(date);
            }

        })

    });
</script>

See Also

Is this article helpful? Yes / No
Thank you for your feedback!

Give article feedback

Tell us how we can improve this article

close
Dummy