Telerik is a leading vendor of ASP.NET AJAX, ASP.NET MVC, Silverlight, WinForms and WPF controls and components, as well as .NET Reporting, .NET ORM , .NET CMS, Code Analysis, Mocking, Team Productivity and Automated Testing Tools. Building on its expertise in interface development and Microsoft technologies, Telerik helps customers build applications with unparalleled richness, responsiveness and interactivity. Telerik products help thousands of companies to be more productive and deliver reliable applications under budget and on time.
Version Q2 2011 released 07/12/2011
select

Calendar / MonthYearPicker/First look

Example Configuration

RadMonthYearPicker


  • RadMonthYearPicker is a flexible component that allows the user to select month and year and to display that month/year in the specified format and culture.

    • MinDate, MaxDate - the control will not accept dates beyond the specified range
    • DisplayDateFormat - Customize the display month/year format for the input
    • EnableShadows - true by default. The MonthYearView component will appear with shadow effect.
    • DatePopupButton-Tooltip - the default value is "Open the calendar popup."
    • ShowPopupOnFocus - false by default. The textbox can be focused with the mouse or the keyboard. This functionality may not be very usable for users, which prefer entering dates manually and using the up/down arrow keys to modify the date value
    • EnableScreenBoundaryDetection - true by default. The control's popup can appear on various sides, regardless of the PopupDirection property value, so that the popup is not displayed beyond the page edge.

Source Code

C# VB.NET
Show code in new window Demo isolation steps
  • <%@ Page CodeFile="DefaultCS.aspx.cs" Language="c#" AutoEventWireup="true" Inherits="Telerik.Web.Examples.Calendar.MonthYearPicker.FirstLook.DefaultCS" %>

    <%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
    <%@ Register TagPrefix="qsf" Namespace="Telerik.QuickStart" %>
    <%@ Register TagPrefix="qsf" TagName="Header" Src="~/Common/Header.ascx" %>
    <%@ Register TagPrefix="qsf" TagName="HeadTag" Src="~/Common/HeadTag.ascx" %>
    <%@ Register TagPrefix="qsf" TagName="Footer" Src="~/Common/Footer.ascx" %>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <qsf:HeadTag ID="Headtag1" runat="server"></qsf:HeadTag>
        <style type="text/css">
            #ConfigurationPanel1 ul
            {
                list-style: none;
                margin: 1em 0 0.6em;
                padding: 0;
            }
            #ConfigurationPanel1 li
            {
                margin: 0;
                padding: 5px 0 10px;
            }
            #ConfigurationPanel1 li input[type="checkbox"]
            {
                vertical-align: middle;
            }
        </style>
    </head>
    <body class="BODY">
        <form id="mainForm" method="post" runat="server">
        <qsf:Header ID="Header1" runat="server" NavigationLanguage="CS"></qsf:Header>
        <!-- content start -->
        <telerik:RadScriptManager ID="RadScriptManager1" runat="server" />
        <telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server">
        </telerik:RadAjaxLoadingPanel>
        <telerik:RadAjaxManager EnableAJAX="true" runat="server">
            <AjaxSettings>
                <telerik:AjaxSetting AjaxControlID="Panel1">
                    <UpdatedControls>
                        <telerik:AjaxUpdatedControl ControlID="Panel1" />
                    </UpdatedControls>
                </telerik:AjaxSetting>
                <telerik:AjaxSetting AjaxControlID="Panel1">
                    <UpdatedControls>
                        <telerik:AjaxUpdatedControl ControlID="RadMonthYearPicker1" LoadingPanelID="RadAjaxLoadingPanel1" />
                    </UpdatedControls>
                </telerik:AjaxSetting>
            </AjaxSettings>
        </telerik:RadAjaxManager>
        <asp:Panel ID="Panel1" runat="server">
            <qsf:ConfiguratorPanel ID="ConfigurationPanel1" runat="server" Orientation="Vertical">
                <ul>
                    <li>MinDate
                        <telerik:RadDatePicker ID="rdpMinDate" runat="server" Width="140px" AutoPostBack="true"
                            DateInput-EmptyMessage="MinDate" MinDate="01/01/1000" MaxDate="01/01/3000">
                            <Calendar runat="server">
                                <SpecialDays>
                                    <telerik:RadCalendarDay Repeatable="Today" ItemStyle-CssClass="rcToday" />
                                </SpecialDays>
                            </Calendar>
                        </telerik:RadDatePicker>
                    </li>
                    <li>MaxDate
                        <telerik:RadDatePicker ID="rdpMaxDate" runat="server" Width="140px" AutoPostBack="true"
                            DateInput-EmptyMessage="MaxDate" MinDate="01/01/1000" MaxDate="01/01/3000">
                            <Calendar runat="server">
                                <SpecialDays>
                                    <telerik:RadCalendarDay Repeatable="Today" ItemStyle-CssClass="rcToday" />
                                </SpecialDays>
                            </Calendar>
                        </telerik:RadDatePicker>
                    </li>
                    <li>DisplayDateFormat
                        <telerik:RadComboBox ID="rcbDateFormat" runat="server" AutoPostBack="true" Width="100px">
                            <Items>
                                <telerik:RadComboBoxItem Text="MMMM/yyyy" Value="MMMM/yyyy" />
                                <telerik:RadComboBoxItem Text="MM/yyyy" Value="MM/yyyy" Selected="true" />
                                <telerik:RadComboBoxItem Text="yyyy" Value="yyyy" />
                                <telerik:RadComboBoxItem Text="MMMM" Value="MMMM" />
                            </Items>
                        </telerik:RadComboBox>
                    </li>
                    <li>
    <asp:CheckBox runat="server" ID="chkEnableShadows" Checked="true" Text="Enable shadows"
    AutoPostBack="True" OnCheckedChanged="chkEnableShadows_CheckedChanged"></asp:CheckBox></li>

                    <li>Select popup expand direction:<br />
                        <br />
                        <telerik:RadComboBox runat="server" ID="ddlPopupDirection" AutoPostBack="True"
                            OnSelectedIndexChanged="ddlPopupDirection_SelectedIndexChanged">
                            <Items>
                                <telerik:RadComboBoxItem Value="BottomRight" Text="BottomRight(default)" />
                                <telerik:RadComboBoxItem Value="BottomLeft" Text="BottomLeft" />
                                <telerik:RadComboBoxItem Value="TopRight" Text="TopRight" />
                                <telerik:RadComboBoxItem Value="TopLeft" Text="TopLeft" />
                            </Items>
                        </telerik:RadComboBox>
                        <br />
                    </li>
                    <li>
                        <telerik:RadTextBox ID="riTooltip" runat="server" AutoPostBack="true" Label="Tooltip"
                            Width="230px" /></li>
                    <li>
    <asp:CheckBox ID="chkShowPopupOnFocus" runat="server" Checked="true" AutoPostBack="true"
    Text="Show popup on textbox focus" /></li>

                    <li>
    <asp:CheckBox ID="chkEnableScreenBoundaryDetection" runat="server" Checked="true"
    AutoPostBack="true" Text="Enable screen boundary detection" /></li>

                </ul>
            </qsf:ConfiguratorPanel>
        </asp:Panel>
        <h3 class="qsfSubtitle">
            RadMonthYearPicker</h3>
        <telerik:RadMonthYearPicker ID="RadMonthYearPicker1" runat="server" ZIndex="30001">
        </telerik:RadMonthYearPicker>
        <div style="clear: both">
        </div>
        <!-- content end -->
        <qsf:Footer ID="Footer1" runat="server"></qsf:Footer>
        </form>
    </body>
    </html>

Get more than expected!

 
 

Take your time to truly experience the power of RadControls for ASP.NET AJAX with a free 60-day trial backed up by Telerik’s unlimited dedicated support.

Download your RadControls for ASP.NET AJAX trial and jumpstart your development with the available Getting Started resources.

If you have any questions, do not hesitate to contact us at sales@telerik.com.

Copyright 2002-2024 © Telerik. All right reserved
Telerik Inc, 201 Jones Rd, Waltham, MA 02451