-1

I'm trying to learn Kendo and want to a basic DateTimePicker using Kendo UI Core. I've added the following links to the head and code from the example but it only returns a basic input box with no datepicker or anything else. It seems like I'm missing a script or something. Anyone have any ideas on some help?

<head runat="server">
    <script src="Kendo/js/jquery.min.js"></script>
    <script src="Kendo/js/kendo.core.min.js"></script>
    <script src="Kendo/js/kendo.core.min.js"></script>
    <script src="Kendo/js/kendo.datepicker.min.js"></script>
    <script src="Kendo/js/kendo.datetimepicker.min.js"></script>
    <script src="Kendo/js/kendo.popup.min.js"></script>
    <script src="Kendo/js/kendo.timepicker.min.js"></script>
</head>
<body>
    <form id="form1" runat="server">

        <div id="example">
            <div id="to-do">
                <input id="datetimepicker" />
            </div>
            <script>
                $(document).ready(function () {
                    // create DateTimePicker from input HTML element
                    $("#datetimepicker").kendoDateTimePicker({
                        value: new Date()
                    });
                });
            </script>
            <style>
                #to-do {
                    height: 52px;
                    width: 221px;
                    margin: 30px auto;
                    padding: 91px 0 0 188px;
                }

                    #to-do .k-datetimepicker {
                        width: 200px;
                    }

                html.k-material #to-do {
                    height: 55px;
                    width: 260px;
                    padding: 87px 0 0 150px;
                }

                    html.k-material #to-do .k-datetimepicker {
                        width: 240px;
                    }
            </style>
        </div>

    </form>
</body>
David Caver
  • 11
  • 4

1 Answers1

1

You need to include kendo.calendar.min.js and kendo.popup.min.js before kendo.datepicker.min.js. The full list of JavaScript files requirements is available here.

Atanas Korchev
  • 30,562
  • 8
  • 59
  • 93
  • Cool. That got me closer. Now I kneed to figure out the CSS issue because it doesn't look right at all. I think I saw somewhere that you have to do something different if you are using Bootstrap, which I am. – David Caver Apr 06 '15 at 12:15
  • One other question with it. I'm just testing out with one Kendo control at the moment an I'm putting the references to the .js files in my master page (this is a webforms project). Anyone see any issues with adding the references to the master page or should I put the references on the individual pages? Seems like the order that they are read makes a difference so I don't know how that will come into play with multiple controls throughout the site. – David Caver Apr 07 '15 at 13:58
  • That link saved me a whole lot of trouble. Thank you. – Icestorm0141 Apr 12 '16 at 12:51