Custom Skin for Shared Calendar

8 posts, 1 answers
  1. Matthew
    Matthew avatar
    9 posts
    Member since:
    Dec 2010

    Posted 22 Dec 2010 Link to this post

    Hi,
    I was wondering if there is a way to apply a global skin for shared calendars, eg the popup calendar on the DatePicker in the grid filtering column. I currently have the following in my skin file which is working for all Calendars of DatePickers, but the calendar in the grid filtering column appears to be of type SharedCalendar and  is not rendering the same. I can do it with code in the OnItemDataBoundEvent for the grid, but I have a lot of grids as well as some that are generated at runtime..

    Any help would be most appreciated..

    Thanks.

    Matt.

    <telerik:RadDatePicker runat="server" skin="Vista">
        <DateInput runat="server"
            onkeydown="return datePickerToday(this, event);"
            IncrementSettings-InterceptArrowKeys="false"
            IncrementSettings-InterceptMouseWheel="false"
            DateFormat="MM/dd/yyyy"
            ToolTip="Shortcut Keys:  Press 'T' for today. Use up and down arrows to change day/month/year based on cursor location." />
            <Calendar ShowRowHeaders="false" >
                <SpecialDays>
                 <telerik:RadCalendarDay Repeatable="Today" Date="" IsToday="true">
                   <ItemStyle CssClass="rcToday" />
                 </telerik:RadCalendarDay>
                </SpecialDays>
            </Calendar>
    </telerik:RadDatePicker>
  2. Iana Tsolova
    Admin
    Iana Tsolova avatar
    3388 posts

    Posted 27 Dec 2010 Link to this post

    Hello Matthew,

    The RadControls added in RadGrid have the same Skin as the grid does. Therefore, you can either change the grid to use the same Skin as the other pickers/calendars on the page. Or create custom Skin for the grid and the calendar, etc. controls which uses the styles for the current grid Skin and the styles of the desired Skin for the calendars.

    Best wishes,
    Iana
    the Telerik team
    Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Mark
    Mark avatar
    79 posts
    Member since:
    Apr 2007

    Posted 27 Dec 2010 Link to this post

    Thanks for the reply.

    I guess what I was looking for was to apply the class "rcToday" to the datepicker in the filtercolumn header of the rad grid as I have done across the rest of the site. I have attached some screenshots of what I am trying to achieve..

    I was hoping to do this at skin level as there are a lot of grids in the site and I really don't want to have to apply this to each grid...
  5. Matthew
    Matthew avatar
    9 posts
    Member since:
    Dec 2010

    Posted 27 Dec 2010 Link to this post

    Sorry, the previous post was from me, someone else was logged in on this computer before me...
  6. Iana Tsolova
    Admin
    Iana Tsolova avatar
    3388 posts

    Posted 28 Dec 2010 Link to this post

    Hi Matthew,

    Can you elaborate on how you achieve the desired behavior with the standalone picker? What is its declaration and are you adding any special days for it?

    This forum thread discusses a similar scenario. Check it out and let me know if it helps.

    Regards,
    Iana
    the Telerik team
    Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.
  7. Matthew
    Matthew avatar
    9 posts
    Member since:
    Dec 2010

    Posted 28 Dec 2010 Link to this post

    Hi Iana,

    I am able to set the selected day in the standalone pickers using the following code in a file called Telerik.skin in my app_themes directory.
    <telerik:RadDatePicker runat="server" skin="Vista">
        <DateInput runat="server"
            onkeydown="return datePickerToday(this, event);"
            IncrementSettings-InterceptArrowKeys="false" 
            IncrementSettings-InterceptMouseWheel="false"
            DateFormat="MM/dd/yyyy"
            ToolTip="Shortcut Keys:  Press 'T' for today. Use up and down arrows to change day/month/year based on cursor location." />
            <Calendar ShowRowHeaders="false" >
                <SpecialDays>
                 <telerik:RadCalendarDay Repeatable="Today" Date="" IsToday="true">
                   <ItemStyle CssClass="rcToday" />
                 </telerik:RadCalendarDay>
                </SpecialDays>
            </Calendar>
    </telerik:RadDatePicker>
      
    <telerik:RadDateTimePicker runat="server" skin="Vista">
        <DateInput runat="server"
            onkeydown="return datePickerToday(this, event);"
            IncrementSettings-InterceptArrowKeys="false"
            IncrementSettings-InterceptMouseWheel="false"
            ToolTip="Shortcut Keys:  Press 'T' for today. Use up and down arrows to change day/month/year based on cursor location." />
            <Calendar ShowRowHeaders="false" >
                <SpecialDays>
                 <telerik:RadCalendarDay Repeatable="Today" Date="" IsToday="true">
                   <ItemStyle CssClass="rcToday" />
                 </telerik:RadCalendarDay>
                </SpecialDays>
            </Calendar>
    </telerik:RadDateTimePicker>
    I am able to set the selected day in the RadGrid Filter calendar just like in the post you mentioned, But I have a lot of grids on my site including many which are dynamically generated in code based on search results and was obviously trying to avoid having to add 50+ ItemCreated events across the site.

    thanks

    Matt
  8. Answer
    Iana Tsolova
    Admin
    Iana Tsolova avatar
    3388 posts

    Posted 30 Dec 2010 Link to this post

    Hi Matthew,

    Have you tried adding the following RadCalendar declaration in the Skin file:

    <telerik:RadCalendar runat="server" ShowRowHeaders="false"
        <SpecialDays
            <telerik:RadCalendarDay Repeatable="Today" Date="" IsToday="true"
                <ItemStyle CssClass="rcToday" /> 
            </telerik:RadCalendarDay>
        </SpecialDays
    </telerik:RadCalendar>


    Regards,
    Iana
    the Telerik team
    Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.
  9. Matthew
    Matthew avatar
    9 posts
    Member since:
    Dec 2010

    Posted 30 Dec 2010 Link to this post

    No I had not, And that seems to have fixed the issue. Thank you very much for all your assistance.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017