I had the same problem, except that the calendar would get cut off horizontally within a jQuery UI dialog window.

If it helps anyone, here is my code:

function wdpAirDate_CalendarOpening(sender, args)
{
 $util._datePickerTime = new Date().getTime();
 if ($util._old_getDropPoint)
  return;
 $util._old_getDropPoint = $util._getDropPoint;
 $util._getDropPoint = function (elem, drop)
 {
  var p = this._old_getDropPoint(elem, drop);
 if (this._datePickerTime + 100 > new Date().getTime())
   if (drop.offsetLeft + drop.offsetWidth > drop.offsetParent.getClientRects()[0].width)
   {
    p.x -= (drop.offsetLeft + drop.offsetWidth) - drop.offsetParent.getClientRects()[0].width;
    p.x -= 15;
   }
  return p;
 };
}

Hi Miglage,

That question missed my attention and I apologize for delay with response.

The WebDatePicker does not raise special event which allows to adjust location of drop-down calendar. The calculation of calendar location is based on location of editor relative to visible bounds of browser window. If there is not enough space below editor and space above editor is larger than space below, then calendar should appear above editor. There is no option to modify that functionality.

The best application can do is to override/hack method which is used by date-picker to calculated drop-down point. Below is example:

<script type="text/javascript" id="igClientScript1">
 function WebDatePicker1_CalendarOpening(sender, eventArgs)
 {
  $util._datePickerTime = new Date().getTime();
  if ($util._old_getDropPoint)
   return;
  $util._old_getDropPoint = $util._getDropPoint;
  $util._getDropPoint = function (elem, drop)
  {
   var p = this._old_getDropPoint(elem, drop);
   if (this._datePickerTime + 100 > new Date().getTime())
    if (p.y > this.getPosition(elem).y)
     p.y -= elem.offsetHeight + drop.offsetHeight;
   return p;
  };
 }
</script>
<ig:WebDatePicker ID="WebDatePicker1" runat="server">
  <ClientSideEvents CalendarOpening="WebDatePicker1_CalendarOpening" />
</ig:WebDatePicker>