AM/PM in Calendar

Suite and Optimus Suite 5
#1

Our users need to select the calendar time in 12 hour clock mode. Is that supported?

#2

There is no native method to operate this.

#3

Here is a working solution, done by modifying dhtmlxcalendar.js in three locations.

Here:

			for (var q=0; q<4; q++) {
				var ul = document.createElement("UL");
				ul.className = "dhtmlxcalendar_selector_line";
				this.hsCont.appendChild(ul);
				for (var w=0; w<6; w++) {
					var li = document.createElement("LI");
					
// Start modifications. Change display to use 12-hour clock. See http://forum.dhtmlx.com/viewtopic.php?f=7&t=24808&p=78929&hilit=+time+format+#p78929.
					
               					if (i>11)
               						{
               						
               						if(i - 12 == 0) {
               							ii = 12;
               						}
               						else {
               							ii = i - 12;
               						}               							
               						li.innerHTML = this._fixLength((ii) + ' p ', 2);      
               					} else
               						{
               						if(i == 0) {
               							ii = 12;
               						}
               						else {
               							ii = i;
               						}
               						li.innerHTML = this._fixLength(ii + ' a ', 4);
               					}
					
					//li.innerHTML = this._fixLength(i,2);

// End modifications.
					li.className = "dhtmlxcalendar_selector_cell";
					ul.appendChild(li);
					li._hours = i;
					li._cell = true;
					this._hsCells[i++] = li;
				}

And here:

	// update hours in calendar
	this._updateVisibleHours = function() {
// Start modifications. Change display to use 12-hour clock. See http://forum.dhtmlx.com/viewtopic.php?f=7&t=24808&p=78929&hilit=+time+format+#p78929.
		//this.contTime.firstChild.firstChild.childNodes[1].innerHTML = this._fixLength(this._activeDate.getHours(),2);
		//alert(this._activeDate);
		var i = this._fixLength(this._activeDate.getHours(),2);
		var ii = 0;
               					if (i>11)
               						{
               						
               						if(i - 12 == 0) {
               							ii = 12;
               						}
               						else {
               							ii = i - 12;
               						}               							
               						this.contTime.firstChild.firstChild.childNodes[1].innerHTML = this._fixLength('&nbsp;&nbsp; PM ' + (ii/1), 2);      
               					} else
               						{
               						if(i == 0) {
               							ii = 12;
               						}
               						else {
               							ii = i;
               						}
               						this.contTime.firstChild.firstChild.childNodes[1].innerHTML = this._fixLength('&nbsp;&nbsp; AM ' + ii/1, 4);
               							
               					}
// End modifications.

	}

And finally here:

				case "%h":
					if (!isNaN(v[q])) {
						var v0 = Number(v[q]);						
						//Check if "PM" occurs in the date/time string. Add 12 hours if so and hour count is not 12.
						if (val.match(/PM/gi) == "PM") {
							if (v0 != 12) {
								v0 = v0 + 12;
							} 
						}	
						//Check if "AM" occurs in the date/time string. Set to 0 hours if so and hour count is 12.
						if (val.match(/AM/gi) == "AM") {
						    	if (v0 == 12) {
						    		v0 = 0;
							}
						}						
					} 	
					r.setHours(v0);					
					break;

Hope this helps!