ASP.NET 4.5 C#: Ajax calendar only works after postback

Hello

In my webforms application I have a nested master page.

On this nested master page, inside an update panel,  I have an Ajax calendar extender that targets a textbox.

For some reason when the page is first loaded, the calendar extender does not display when I click the text box.

However, it works fine after I click a control that causes a postback.

My script manager is on the top-level master page.

The same text box and calendar extender works fine on a normal aspx page that links to the top-level master page.

In a nutshell, the problem seems to be that my calendar extender on my nested master page only displays after a postback.

Here is my mark-up:

<asp:UpdatePanel ID="uplTripPlanner" UpdateMode="Conditional" runat="server">
                        <ContentTemplate>
                            <div class="txtPadding">
                                <strong>Arrive</strong><br />
                                <asp:TextBox ID="txtTripArrive" runat="server" CssClass="txtDates"></asp:TextBox>
                                <cc1:CalendarExtender ID="txtTripArrive_CalendarExtender" runat="server"
                                    Enabled="True" TargetControlID="txtTripArrive" Format="dd/MM/yyyy"
                                    PopupButtonID="txtTripArrive">
                                </cc1:CalendarExtender>
                                <asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" ErrorMessage="RequiredFieldValidator"
                                    ControlToValidate="txtTripArrive" ValidationGroup="TripDates" CssClass="WarningText10">* Required</asp:RequiredFieldValidator>
                                <asp:HiddenField ID="hfdTripArrive" runat="server" />
                                <asp:HiddenField ID="hfdTripDepart" runat="server" />
                                <br />
                                <strong>Depart</strong><br />
                                <asp:TextBox ID="txtTripDepart" runat="server" CssClass="txtDates"></asp:TextBox>
                                <cc1:CalendarExtender ID="txtTripDepart_CalendarExtender" runat="server"
                                    Enabled="True" TargetControlID="txtTripDepart" Format="dd/MM/yyyy" PopupButtonID="txtTripDepart">
                                </cc1:CalendarExtender>
                                <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ErrorMessage="RequiredFieldValidator"
                                    ControlToValidate="txtTripDepart" ValidationGroup="TripDates" CssClass="WarningText10">* Required</asp:RequiredFieldValidator>
                                <br />
                                <div style="text-align:right;">
                                    <asp:Button ID="btnTripDates" runat="server" Text="Go!"
                                        CssClass="btnTripDatesGo" ValidationGroup="TripDates"
                                            onclick="btnTripDates_Click" /></div>
                                    <asp:CompareValidator ID="CompareValidator1" Operator="GreaterThanEqual" Type="Date"
                                    ControlToValidate="txtTripDepart" ControlToCompare="txtTripArrive"
                                    ErrorMessage="Arrival must be BEFORE departure!"  runat="server" ValidationGroup="TripDates" CssClass="WarningText10" />
                            </div>
                        </ContentTemplate>
                    </asp:UpdatePanel>

Any suggestions are greatly appreciated.

Kind regards

Jubbs