I want to combine date and time in one input text box and whenever onclick event on the “small calendar image”, the calendar pops up and show the date and time corresponding with the input text box.
Currently I only manage to separate 2 input text box representing each date and time respectively.
Here are my codes.
<script type="text/javascript">
var calendar;
var tp;
//initialize the popup calendar
function initCalendar(){
calendar = new dhtmlxCalendarObject("container",false);
calendar.draw();
calendar.enableTime(true);
tp = calendar.tp;
calendar.setPosition(document.getElementById("calendaricon"));
calendar.hide();
calendar.attachEvent("onClick",function(date){
var input = document.getElementById("input");
input.value = calendar.getFormatedDate("%d.%m.%Y", date);
var input2 = document.getElementById("input2");
input2.value = tp.getFormatedTime("%H:%i:%s");
calendar.hide();
});
}
function toggle(){
if(calendar.isVisible()){
calendar.hide();
}
else{
calendar.show();
}
}
</script>
</head>
<body onload="initCalendar()">
<input type="text" name="input" id="input" value="" />
<input type="text" name="input2" id="input2" value="" />
<img id="calendaricon" src="codebase/imgs/calendar.gif" onclick="toggle();" />
<div id="container"></div>