Help with event duration calender like on home

Suite and Optimus Suite 5
#1

Hi guys…

I need an event duration calender exactly like how it is on

dhtmlx.com/docs/products/dhtmlxCalendar/.

I’m trying to do it for ages, but I’m missing something. I can’t find any example source code to do it (except for the page source from the above link, but didn’t work for me) ready so please help.

Thx

#2

Hi,

here is the example:

  • there are two inputs:

<input id="start_date"/> <input id="end_date"/>

  • and calendar:

[code]

[/code]

Double calendar consists of two sigle calendars. So, you may do the following:

dCal.leftCalendar.attachEvent("onClick",function(date){ document.getElementById("start_date").value = this.getFormatedDate(); }) dCal.rightCalendar.attachEvent("onClick",function(data){ document.getElementById("end_date").value = this.getFormatedDate(); })

#3

I’d like to do the exact same thing except have my calendar show up only when the input box associated with the each of the double calendars is clicked.

Any ideas how I should do this? I know I no longer want the div for the calendars, and I think should modify something when declaring the new calendar object? This is what my code looks like now:

[code]<input type=“text” id=“startDate”, name=“startDate”, readonly=“true”, size=“7”/>
<input type=“text”, id=“endDate”, name=“endDate”, readonly=“true”, size=“7” />

window.onload function() {
dCal = new dhtmlxDblCalendarObject([‘startDate’, ‘endDate’], false);
dCal.setDateFormat("%m/%d/%Y");

		// update input text with selected date 
		dCal.leftCalendar.attachEvent("onClick",function(date){
			document.getElementById("startDate").value = this.getFormatedDate();
			dCal.leftCalendar.setSensitive(null, new Date(date));
		})	
		dCal.rightCalendar.attachEvent("onClick",function(date){
			document.getElementById("endDate").value = this.getFormatedDate();
		})
		dCal.draw();
		}
	</script>[/code]
#4

dhtmlxDblCalendarObject contructor can not take input as a parameter. You may pass only one div container as a parameter.

You may set onclick event handler for both inputs and show calendar. By default double calendar can be hidden:
dCal.hide();