WOW!
I found a fix that makes it work WELL.... okay, with the EXACT code i have above for the ActiveWidgets, but in the calendar.js (better use a BIG editor or vi in linux like I did for the calendar_stripped.js)
Add the following to the Calendar.prototype.create function: (USING VERSION 1.0 of JSCALENDAR.... 2.0.1 AW)
calendar.js (similar in calendar_stripped.js)
...
Calendar.prototype.create = function (_par,_draggable) {
var parent = null;
if (! _draggable) { this.isDrag = true; } else { this.isDrag = false; }
if (! _par) {
parent = document.getElementsByTagName("body")[0];
this.isPopup = true;
} else {
parent = _par;
this.isPopup = false;
}
..........
row = Calendar.createElement("tr", thead);
var title_length = 6;
(this.isPopup && this.isDrag) && --title_length;
(this.weekNumbers) && ++title_length;
..........
hh("?", 1, 400).ttip = Calendar._TT["INFO"];
this.title = hh("", title_length, 300);
this.title.className = "title";
if (this.isPopup && this.isDrag) {
this.title.ttip = Calendar._TT["DRAG_TO_MOVE"];
this.title.style.cursor = "move";
hh("×", 1, 200).ttip = Calendar._TT["CLOSE"];
}
..........
cell.className = "ttip";
if (this.isPopup && this.isDrag) {
cell.ttip = Calendar._TT["DRAG_TO_MOVE"];
cell.style.cursor = "move";
}
this.tooltips = cell;
....
Basically, all I did was add the _draggable parameter to the function. Chances are, you can easily go back to all of your Calendar.create calls and change those you STILL want to BE draggable to have an additional 'true' parameter (in addition to the null parameter so that the calendar is still a popup).
So, in other words: Calendar.create() takes an argument already. If it is null, then the calendar appears as a popup, draggable.... BUT after the changes, the popup defaults to non-draggable. You have to add the second true value as a parameter to make it draggable.
SO Back to AW: in order to have the Combo popup work like we might want, we make the changes above, then any non-combo like calendars we add the 'true' parameter to. BUT the combo entries we leave as-is.
So, if you use the code from my previous posts, you'll get a working calendar popup in a combo box.
BUT now let's say you want more than one! Use the following as another template:
(just a rewritten example to put the calPopup into the right scope for repitition and the show() function SHOWS it relative to that element.)
<html>
<head>
<title>JSCalendar and AW version 2.0.1</title>
<link href="runtime/styles/aqua/aw.css" rel="stylesheet"></link>
<script language="javascript" type="text/javascript" src="runtime/lib/aw.js"></script>
<link rel="stylesheet" href="calendar-blue.css"></link>
<script type="text/javascript" src="calendar.js"></script>
<script type="text/javascript" src="calendar-en.js"></script>
<style type="text/css">
.special { background-color: #000; color: #fff; }
</style>
</head>
<body>
<script>
var SPECIAL_DATES={2006:{0:[1],6:[4],10:[11,18],11:[25,30,31]},2007:{0:[1],5:[26,29],6:[4],10:[11,18],11:[25,30],},2008:{0:[1],6:[4],11:[25],}};
var dateIsSpecial = function(year, month, day){var m = SPECIAL_DATES[year];if (!m) return false;var d = m[month];if (!d) return false;for (var i in d) if (d[i] == day) return true;return false;}
var DatePicker1 = new AW.UI.Combo;
DatePicker1.setId("DatePicker1");
DatePicker1.getContent('box/text').setAttribute('autocomplete', 'off');
DatePicker1.setPopupTemplate(function(){
var self=this;
this.calPopup_onSelect = function(calendar, date){if(calendar.dateClicked){self.setControlText(date);calendar.callCloseHandler();}}
this.calPopup_onClose = function(calendar){calendar.hide();calendar.destroy();}
this.calPopup_dateStatusHandler = function(date, y, m, d){if (dateIsSpecial(y, m, d)) return "special";else return false;}
this.calPopup = new Calendar(0, null, this.calPopup_onSelect , this.calPopup_onClose);
this.calPopup.weekNumbers = false;
this.calPopup.setDateFormat("%m/%d/%Y");
this.calPopup.setDateStatusHandler(this.calPopup_dateStatusHandler);
this.calPopup.create();
this.calPopup.showAtElement(this.element(),"Bc");
return new AW.HTML.DIV;
});
document.write(DatePicker1);
</script><hr /><script>
var DatePicker2 = new AW.UI.Combo;
DatePicker2.setId("DatePicker2");
DatePicker2.getContent('box/text').setAttribute('autocomplete', 'off');
DatePicker2.setPopupTemplate(function(){
var self=this;
this.calPopup_onSelect = function(calendar, date){if(calendar.dateClicked){self.setControlText(date);calendar.callCloseHandler();}}
this.calPopup_onClose = function(calendar){calendar.hide();calendar.destroy();}
this.calPopup_dateStatusHandler = function(date, y, m, d){if (dateIsSpecial(y, m, d)) return "special";else return false;}
this.calPopup = new Calendar(0, null, this.calPopup_onSelect , this.calPopup_onClose);
this.calPopup.weekNumbers = false;
this.calPopup.setDateFormat("%m/%d/%Y");
this.calPopup.setDateStatusHandler(this.calPopup_dateStatusHandler);
this.calPopup.create();
this.calPopup.showAtElement(this.element(),"Bc");
return new AW.HTML.DIV;
});
document.write(DatePicker2);
</script>
</body>
</html>