JSFiddle - React, Tailwind, and code Playground

by Josh Eastburn

HTML

<script src="http://cdn.kendostatic.com/2013.2.918/js/kendo.all.min.js"></script>
<link rel="stylesheet" href="http://cdn.kendostatic.com/2013.2.918/styles/kendo.default.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2013.2.918/styles/kendo.common.min.css">
<input id="timepicker" />
<div id="log" class="log"></div>

CSS

.log {
    background-color: #eee;
    margin: 20px 0;
}

JavaScript

(function () {
    var log = (function (el) {
        return function (text) {
            el.html(el.html() + '<br/>' + text);
        };
    })($('#log'));

    var viewModel = kendo.observable({
        dropDownData: '2013-10-25T16:23:00'
    });
    // '2013-10-25T16:23:00'
    
    
var tp = $("#timepicker").kendoTimePicker({
    format: "h:mm tt",
    parseFormats: ["hh:mm"], //format also will be added to parseFormats
}).data("kendoTimePicker");
    
    //tp.value('2013-10-25T16:23:00');
    tp.value('22:14');
    
    
    
    log('example log message');

    kendo.bind('body', viewModel);
//debugger;
})()