Calendar demo

Source of: MsAjax.aspx

<script runat="server">

    protected void MonthCalendar_SelectionChanged(object sender, EventArgs e) {
        Calendar.FirstDate = MonthCalendar.SelectedDate;
    }

    protected void MonthCalendar_PreRender(object sender, EventArgs e) {
        MonthCalendar.SelectedDate = Calendar.FirstDate;
    }

    protected void GridView1_PreRender(object sender, EventArgs e) {
        GridView1.DataSource = Calendar.Appointments;
        GridView1.DataBind();
    }

</script>

    <asp:ScriptManager ID="ScriptManager1" runat="server">
    </asp:ScriptManager>
    <asp:UpdatePanel ID="UpdatePanel1" runat="server">
        <ContentTemplate>
            <table width="100%">
                <tr>
                    <td valign="top">
                        <goc:DailyCalendar ID="Calendar" runat="server" BorderColor="MidnightBlue" Font-Names="Verdana"
                            Font-Size="Small" Height="398px" Width="444px" FreeHourColor="LightSteelBlue"
                            LineColor="MediumBlue" WorkHourColor="Lavender" ObjectID="CalObj" 
                            ViewOptions="ShowTimeScrollBar, ShowDateNavigator">
                            <DateBarStyle Font-Bold="False" Font-Italic="False" HorizontalAlign="Center" ResourceImage="Blue"
                                Font-Size="Small" ForeColor="RoyalBlue" />
                            <AllDayBarStyle BackColor="CornflowerBlue" />
                            <ResourceBarStyle Font-Bold="False" Font-Italic="False" HorizontalAlign="Center"
                                ResourceImage="Blue" ForeColor="#0000C0" />
                            <HoursBarStyle BackColor="AliceBlue" Font-Names="Arial" Font-Size="Small" ForeColor="MidnightBlue" />
                            <DefaultAppointmentStyle Font-Size="X-Small" />
                        </goc:DailyCalendar>
                    </td>
                    <td valign="top">
                        Select date in the linked calendar for changing content of the DailyCalendar 
                        control. Notice, the linked calendar changes its selected date afterwards daily 
                        calendar date navigation was performed as well:<br />
                        <asp:Calendar ID="MonthCalendar" runat="server" BackColor="White" BorderColor="#3366CC"
                            BorderWidth="1px" CellPadding="1" DayNameFormat="Shortest" Font-Names="Verdana"
                            Font-Size="8pt" ForeColor="#003399" Height="200px" Width="220px" OnSelectionChanged="MonthCalendar_SelectionChanged"
                            OnPreRender="MonthCalendar_PreRender">
                            <SelectedDayStyle BackColor="#009999" Font-Bold="True" ForeColor="#CCFF99" />
                            <TodayDayStyle BackColor="#99CCCC" ForeColor="White" />
                            <SelectorStyle BackColor="#99CCCC" ForeColor="#336666" />
                            <WeekendDayStyle BackColor="#CCCCFF" />
                            <OtherMonthDayStyle ForeColor="#999999" />
                            <NextPrevStyle Font-Size="8pt" ForeColor="#CCCCFF" />
                            <DayHeaderStyle BackColor="#99CCCC" ForeColor="#336666" Height="1px" />
                            <TitleStyle BackColor="#003399" BorderColor="#3366CC" BorderWidth="1px" Font-Bold="True"
                                Font-Size="10pt" ForeColor="#CCCCFF" Height="25px" />
                        </asp:Calendar>
                        <br />
                        List of all appointments showing in daily calendar automatically updated after changing
                        of the daily calendar appointment.<br />
                        <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" BackColor="White"
                            BorderColor="#CCCCCC" BorderStyle="None" BorderWidth="1px" CellPadding="3" EnableViewState="False"
                            OnPreRender="GridView1_PreRender" Font-Size="XX-Small">
                            <FooterStyle BackColor="White" ForeColor="#000066" />
                            <Columns>
                                <asp:BoundField DataField="Text" HeaderText="Text" />
                                <asp:BoundField DataField="Start" HeaderText="Start" />
                                <asp:BoundField DataField="End" HeaderText="End" />
                            </Columns>
                            <RowStyle ForeColor="#000066" />
                            <SelectedRowStyle BackColor="#669999" Font-Bold="True" ForeColor="White" />
                            <PagerStyle BackColor="White" ForeColor="#000066" HorizontalAlign="Left" />
                            <HeaderStyle BackColor="#006699" Font-Bold="True" ForeColor="White" />
                        </asp:GridView>
                    </td>
                </tr>
            </table>
            <span style="font-size: 8pt">
            Web Calendar supports MS AJAX technology. MS AJAX library gives alternative ways 
            for refreshing web browser contents without updating a whole HTML page and 
            preventing the screen from blinking (partial refreshing). To do that, the MS 
            AJAX gives its own postback handler that is different from standard ASP.NET 
            callback used by the Calendar control. The calendar contains the <i>PostbackMode</i> 
            property that standard value <i>PostbackInAjax</i> instructs that only standard 
            postback will be sending to the server. All no supported by MS AJAX callbacks 
            will be prohibited. You can still use standard DailyCalendar callbacks of course 
            (<i>PostbackMode==Custom</i>), but then the UpdatePanel control of MS AJAX 
            library will work incorrect. When you are using AJAX technology delivered by 
            another company, and one requires standard postback as well, set the <i>
            PostbackMode </i>to <i>Always </i>value.
         </ContentTemplate>
    </asp:UpdatePanel>