mirror of
https://github.com/hanzoai/jube-fork.git
synced 2026-11-02 14:29:36 +00:00
116 lines
4.1 KiB
HTML
Executable File
116 lines
4.1 KiB
HTML
Executable File
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title>API</title>
|
|
<meta charset="utf-8">
|
|
<link href="../content/shared/styles/examples-offline.css" rel="stylesheet">
|
|
<link href="../../styles/kendo.common.min.css" rel="stylesheet">
|
|
<link href="../../styles/kendo.rtl.min.css" rel="stylesheet">
|
|
<link href="../../styles/kendo.default.min.css" rel="stylesheet">
|
|
<link href="../../styles/kendo.default.mobile.min.css" rel="stylesheet">
|
|
<script src="../../js/jquery.min.js"></script>
|
|
<script src="../../js/jszip.min.js"></script>
|
|
<script src="../../js/kendo.all.min.js"></script>
|
|
<script src="../content/shared/js/console.js"></script>
|
|
<script>
|
|
|
|
</script>
|
|
|
|
|
|
</head>
|
|
<body>
|
|
|
|
<a class="offline-button" href="../index.html">Back</a>
|
|
|
|
|
|
<div id="example">
|
|
<div class="configurator">
|
|
<div class="header">Configurator</div>
|
|
<div class="box-col">
|
|
<h4>Get value</h4>
|
|
<ul class="options">
|
|
<li>
|
|
<button id="get" class="k-button">Get date</button>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<div class="box-col">
|
|
<h4>Set value</h4>
|
|
<ul class="options">
|
|
<li>
|
|
<input id="value" value="10/10/2000" />
|
|
<button id="set" class="k-button">Set date</button>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<div class="box-col">
|
|
<h4>Navigation</h4>
|
|
<ul class="options">
|
|
<li>
|
|
<select id="direction">
|
|
<option value="up">upper view</option>
|
|
<option value="down">lower view</option>
|
|
<option value="past">past</option>
|
|
<option value="future" selected="selected">future</option>
|
|
</select>
|
|
<button id="navigate" class="k-button">Navigate</button>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<div class="demo-section k-content" style="text-align: center;">
|
|
<h4>Pick a date</h4>
|
|
<div id="calendar"></div>
|
|
</div>
|
|
|
|
<script>
|
|
$(document).ready(function() {
|
|
$("#calendar").kendoCalendar();
|
|
|
|
var calendar = $("#calendar").data("kendoCalendar");
|
|
calendar.value(new Date());
|
|
|
|
var navigate = function () {
|
|
var value = $("#direction").val();
|
|
switch(value) {
|
|
case "up":
|
|
calendar.navigateUp();
|
|
break;
|
|
case "down":
|
|
calendar.navigateDown(calendar.value());
|
|
break;
|
|
case "past":
|
|
calendar.navigateToPast();
|
|
break;
|
|
default:
|
|
calendar.navigateToFuture();
|
|
break;
|
|
}
|
|
},
|
|
setValue = function () {
|
|
calendar.value($("#value").val());
|
|
};
|
|
|
|
$("#get").click(function() {
|
|
alert(calendar.value());
|
|
});
|
|
|
|
$("#value").kendoDatePicker({
|
|
change: setValue
|
|
});
|
|
|
|
$("#set").click(setValue);
|
|
|
|
$("#direction").kendoDropDownList({
|
|
change: navigate
|
|
});
|
|
|
|
$("#navigate").click(navigate);
|
|
});
|
|
</script>
|
|
</div>
|
|
|
|
|
|
</body>
|
|
</html>
|