Scroll To Top

How to close CalendarExtender on lost focus or mouse out

By Suthish Nair Dec 08, 2010
CalendarExtender control will not close automatically once opened without selecing a date. This small code snippets helps to achive the control to close once its loses the focus.
script language="javascript" type="text/javascript">
   var blnflag = false;
   document.onmouseout =
function(sender, args)
      if (event.srcElement.tagName.toLowerCase() == "div" && event.srcElement.outerHTML.indexOf("ajax__calendar") > 0) blnflag = true;
      if (blnflag && event.srcElement.tagName.toLowerCase() != "div")
         blnflag =

asp:TextBox id="txtFrom" onkeypress="return false;" onkeydown="return false;" onmouseover="return false;" runat="server" style="width: 100px" />
<img id="img1" runat="server" alt="Date" src="images/cal.gif" temp_src="images/cal.gif" />
<cc1:CalendarExtender BehaviorID="CEBID1" runat="server" ID="cl1" TargetControlID="txtFrom" PopupButtonID="img1" Format="dd-MMM-yyyy"></cc1:CalendarExtender>