Start Building Professional
Web Apps Today

Calendar show() in function won't persist

I am trying to use a button to open the calendar linked to an Input box. When the function that shows the calendar ends the calendar closes. In fact, the only way to see the calendar is to stop the function with an alert(). This did not occur in version 2.0. Here's a snippet of my code that reproduces this effect.

<link rel="STYLESHEET" type="text/css" href="codebase/dhtmlxcalendar.css">
<script src="codebase/dhtmlxcommon.js"></script>
<script src="codebase/dhtmlxcalendar.js"></script>

<script>
window.dhx_globalImgPath="codebase/imgs/";
    var cal1;
    window.onload = function () {
        cal1 = new dhtmlxCalendarObject('calInput1');
    }
    function Doit()
    {
        cal1.show();
        alert("When Ok is clicked the calendar will disappear!");
        return true;
    }
</script>
<table >
<tr>
<td valign="top"><strong>Click in a text fild</strong><br />
        <input type="text" id="calInput1" style="width: 200px; font-size:12px;" readonly="true"/>
        <input type="button" value="Push Me" id="button" onClick="Doit()"/>
    </td>
</tr>
</table>

Lee

Try to change 
      onClick="Doit()"/>
as
    onClick="Doit(); (arguments[0]||event).cancelBubble=true; "/>

By default calendar is closing on any click on body. When you are clicking on a button, the next order of event is triggered
 - button clicked
       -  calendar is created
 - click reaches the body
       - calendar is closed , as reaction on body-click