JSFiddle - React, Tailwind, and code Playground
HTML
<script src="http://igniteui.com/js/modernizr.min.js"></script>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.min.js"></script>
<script src="http://cdn-na.infragistics.com/igniteui/latest/js/infragistics.core.js"></script>
<script src="http://cdn-na.infragistics.com/igniteui/latest/js/infragistics.lob.js"></script>
<link href="http://cdn-na.infragistics.com/igniteui/latest/css/themes/infragistics/infragistics.theme.css" rel="stylesheet"></link>
<link href="http://cdn-na.infragistics.com/igniteui/latest/css/structure/infragistics.css" rel="stylesheet"></link>
<input id="currentTime"></input>
CSS
h3 {
font-size: 20px;
margin-bottom: 20px;
}
.group-fields {
margin-bottom: 10px;
}
.group-fields label {
display: block;
line-height: 18px;
}
.group-fields .inline {
display: inline;
}
.group-fields .ui-igcheckbox-normal {
margin-right: 5px;
float: left;
}
.group-fields .ui-igedit-container {
width: 230px;
}
.clearfix:after {
content: "";
display: table;
clear: both;
}
.group-fields.clearfix > div {
float: left;
margin-right: 10px;
}
JavaScript
$(function () {
var today = new Date(),
tomorrow = new Date(new Date().getTime() + 24 * 60 * 60 * 1000);
$("#currentTime").igDatePicker({
value: new Date(),
MaxDate:new Date(),
datepickerOptions: {
showButtonPanel: true,
onChangeMonthYear: function(year, month, inst) {
console.log("changed");
setTimeout(function () {
$(".ui-datepicker-close").css('display', 'none');
$(".ui-datepicker-current").text("Today: test");
$(".ui-datepicker-current").css('display', 'inline');
}, 0)
}
},
dropDownListOpened: function (evt, ui) {
$(".ui-datepicker-close").css('display', 'none');
$(".ui-datepicker-current").text("Today: test");
$(".ui-datepicker-current").css('display', 'inline');
}
});
});