Hi Michell,

That is correct, a server control (or its container/s) should belong to Form.Controls, but not to Page.Controls. So, application should ensure that any dynamic Control does not appear outside of Form. Of in case of aspx, a control should be inside of <form>. Otherwise, that control will not function correctly on client and/or values modified on client will be not passed to server after a postback.

If WebDatePicker is created dynamically and there was no other WebDatePicker on initialization, then application may ensure loading shared WebMonthCalendar by something like below:

protected void Page_Load(object sender, EventArgs e)
{
 Infragistics.Web.UI.EditorControls.WebDatePicker.EnsureSharedCalendar(this);
}

I would expect that if WebMonthCalendar is added dynamically to the same container as WebDatePicker and its DropDownCalendarID is set to the ID/ClientID of that calendar, then WebDatePicker should find that calendar on client, hide it on initialization and show calendar on button click. If it does not work.

If container of WebDatePicker is not loaded asynchronously (Ajax is not enabled in WebTab), then you may look at generated html and check if it contains tags and javascript related to WebMonthCalendar attached to WebDatePicker. For example search and verify that html elements contain ID of calendar and those html elements appear within <form> object. Html content can be something like

 <input type="hidden" id="...WebMonthCalendar1_clientState" .. /><table id="...WebMonthCalendar1"...>
...
Sys.Application.add_init(function() {
    $create(Infragistics.Web.UI.WebMonthCalendar, {"id":"...WebMonthCalendar1"...});

If ajax is enabled and container of WebDatePicker is loaded asynchrously, then you may try to debug by processing ClientSideEvents.CalendarOpening and check if WebMonthCalendar object can be found. WebDatePicker has member variable _calID, which is set to the ID of calendar and $util has member method findControl(id).

<script type="text/javascript">
function WebDatePicker1_CalendarOpening(sender, eventArgs)
{
 var calID = sender._calID;
 debugger;
 var cal = $util.findControl(calID);
 alert('cal:' + cal);
}
</script>
<ig:WebDatePicker ID="WebDatePicker1" runat="server" DropDownCalendarID="WebMonthCalendar1">
  <ClientSideEvents CalendarOpening="WebDatePicker1_CalendarOpening" />
</ig:WebDatePicker>
<ig:WebMonthCalendar ID="WebMonthCalendar1" runat="server"></ig:WebMonthCalendar>