How to create a link in a cell of calendar control

2 posts, 0 answers
  1. yoomee kwon
    yoomee kwon avatar
    7 posts
    Member since:
    Oct 2009

    Posted 29 Oct 2009 Link to this post

    I have calendar control and would like to put the show time in each date.   Each date can have 1 or 2 show time.

    When user clicks on each time within a cell,  I would like to capture the value of the time that user clicked.

    Any idea how this can be done?

    Also, how can I align the dates nicely between the dates that have different number of times displayed.  Currently they are not lining up nicely.
  2. Dimo
    Admin
    Dimo avatar
    8452 posts

    Posted 04 Nov 2009 Link to this post

    Hi Yoomee Kwon,


    I is not very clear what you are trying to do, but here is an example, which I hope will give you a starting point.

    <%@ Page Language="C#" %>
    <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
     
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
     
    <head runat="server">
    <meta http-equiv="content-type" content="text/html;charset=utf-8" />
    <title>RadControls for ASP.NET AJAX</title>
    <style type="text/css">
     
    .RadCalendar a
    {
        cursor:pointer;
    }
     
    .RadCalendar .rcMain .rcRow td
    {
        vertical-align:top;
    }
     
    </style>
    </head>
    <body>
    <form id="form1" runat="server">
    <asp:ScriptManager ID="ScriptManager1" runat="server" />
     
    <telerik:RadCalendar ID="RadCalendar1" runat="server">
        <SpecialDays>
            <telerik:RadCalendarDay Date="2009/11/11" TemplateID="MyTemplate" />
        </SpecialDays>
        <CalendarDayTemplates>
            <telerik:DayTemplate ID="MyTemplate">
                <Content>
                    <asp:HyperLink ID="HyperLink1" runat="server" Text="14:30" />
                    <asp:HyperLink ID="HyperLink2" runat="server" Text="16:00" />
                </Content>
            </telerik:DayTemplate>
        </CalendarDayTemplates>
        <ClientEvents OnDateClick="MyDateClick" />
    </telerik:RadCalendar>
     
    <script type="text/javascript">
     
    function MyDateClick(sender, args)
    {
        // differentiate between regular hyperlinks and the hyperlinks inside the CalendarDayTemplates
        if (args.get_domEvent().target.tagName.toLowerCase() == "a" && args.get_domEvent().target.id && args.get_domEvent().target.id != "")
            alert(args.get_domEvent().target.innerHTML);
    }
     
    </script>
     
    </form>
    </body>
    </html>



    All the best,
    Dimo
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
Back to Top