See if this help any:

http://yuihelp.levycodev.com/demos/calendar/multi_cals_on_a_page_help.php

~~bret


--- In ydn-javascript@yahoogroups.com, "ibrmustafa" <imustafa@...> wrote:
>
> Hi,
> Ia m trying to have a date selector where I pop up a calendar when the user
clicks on an image. I pretty much followed the docs in
https://developer.yahoo.com/yui/calendar/ and things pretty much work properly
except for catching the 'click' event. I basically launch and render the
calendar then I hide it immediately. Then I add a listener for 'click' event on
an image with a unique id of 'startCalImage' like this:
> YAHOO.util.Event.addListener("startCalImage", 'click',
showCal(YAHOO.com.lm.date.range.startCal));
>
> I was hoping to see it rendered when I click on the image. But what happens is
only one event is triggered when first the image is rendered at page load in
essence rendering the calendar once. when I choose a date, the right fields are
populated properly and the calendar is hidden by my select handler by issuing
cal.hide();
>
> My problem is when I click on the image, I don't get the event and the
calendar never shows.
>
> Thanks for your help in advance.
>
> I included all my code below for details. Pardon the lengthy message.
>
>
> <div id="startCalDiv" style="float: left; padding-left: 5px;">
> <img id="startCalImage" src="images/bb.gif" style="width: 32px; height:
32px;"/>
> </div>
>
> </div>
>
> <script type="text/javascript">
> YAHOO.namespace("com.lm.date.range");
>
> YAHOO.com.lm.date.range.init = function() {
>
> var yue = YAHOO.util.Event;
> var yud = YAHOO.util.Dom;
>
> function handleSelect(type,args,obj) {
> var dates = args[0];
> var date = dates[0];
> var year = date[0];
> var month = date[1];
> var day = date[2];
>
>
> var selMonth = document.getElementById("selMonth");
> var selDay = document.getElementById("selDay");
> var selYear = document.getElementById("selYear");
>
> selMonth.selectedIndex = month;
> selDay.selectedIndex = day;
> for (var y=0;y<selYear.options.length;y++) {
> if (selYear.options[y].text == year) {
> selYear.selectedIndex = y;
> break;
> }
> }
>
> hideCal(YAHOO.com.lm.date.range.startCal);
> }
>
> function hideCal(cal) {
> cal.hide();
> }
>
> function showCal(cal) {
> YAHOO.util.Event.preventDefault(cal);
> cal.show();
> }
>
> function launchCal() {
> YAHOO.com.lm.date.range.startCal = new
YAHOO.widget.Calendar("startCal","startCalContainer",
> {
mindate:"1/1/2000",
>
maxdate:"12/31/2500",
>
navigator:true,
>
title:"Start Date",
>
close:true
> });
>
>
YAHOO.com.lm.date.range.startCal.selectEvent.subscribe(handleSelect,
YAHOO.com.lm.date.range.startCal, true);
>
> YAHOO.com.lm.date.range.startCal.render();
> hideCal(YAHOO.com.lm.date.range.startCal);
>
> YAHOO.util.Event.addListener("startCalImage", 'click',
showCal(YAHOO.com.lm.date.range.startCal));
> YAHOO.util.Event.addListener("startCalDiv", 'mouseover',
showCal(YAHOO.com.lm.date.range.startCal));
> }
>
> launchCal();
>
> }
>
> YAHOO.util.Event.onDOMReady(YAHOO.com.lm.date.range.init);
> </script>
>