dhtmlx-suite
Version:
dhtmlx nodejs module
55 lines (54 loc) • 1.71 kB
HTML
<html>
<head>
<title>Set interval with two inputs</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
<link rel="stylesheet" type="text/css" href="../../../codebase/fonts/font_roboto/roboto.css"/>
<link rel="stylesheet" type="text/css" href="../../../codebase/dhtmlx.css"/>
<script src="../../../codebase/dhtmlx.js"></script>
<style>
input#date_from, input#date_to {
border: 1px solid #dfdfdf;
font-family: Roboto, Arial, Helvetica;
font-size: 14px;
color: #404040;
background-color: #fafafa;
border: #c0c0c0 1px solid;
width: 100px;
}
span.label {
font-family: Roboto, Arial, Helvetica;
font-size: 14px;
color: #404040;
}
</style>
<script>
var myCalendar;
function doOnLoad() {
myCalendar = new dhtmlXCalendarObject(["date_from","date_to"]);
myCalendar.setDate("2013-03-10");
myCalendar.hideTime();
// init values
var t = new Date();
byId("date_from").value = "2013-03-05";
byId("date_to").value = "2013-03-15";
}
function setSens(id, k) {
// update range
if (k == "min") {
myCalendar.setSensitiveRange(byId(id).value, null);
} else {
myCalendar.setSensitiveRange(null, byId(id).value);
}
}
function byId(id) {
return document.getElementById(id);
}
</script>
</head>
<body onload="doOnLoad();">
<span class="label">From</span> <input type="text" id="date_from" onclick="setSens('date_to', 'max');" readonly="true">
<span class="label">Till</span> <input type="text" id="date_to" onclick="setSens('date_from', 'min');" readonly="true">
</body>
</html>