Ehsan,
You can hide/disable the built-in Navigation Buttons of the RadCalendar by property settings or CSS. See the
Navigation Controls Settings documentation page for insights on this.
Also, the above documentation page provides details on the Month/Date Picker Popup which can be enabled when user clicks on the Title Area of the Title Bar, and this can be used to fast navigate to a specific month.
Alternatively, you can disable navigation buttons by setting the RadCalendar "EnableNavigation="false" and then implement external, associated RadButtons. You can handle calender navigation using JavaScript, setting the RadCalendar to postback and reset the month view.
Here's a somewhat similar application for you to use as a starting point:
Default.aspx:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="Default" %>
<
head
runat
=
"server"
>
<
title
></
title
>
<
telerik:RadStyleSheetManager
id
=
"RadStyleSheetManager1"
runat
=
"server"
/>
</
head
>
<
body
>
<
form
id
=
"form1"
runat
=
"server"
>
<
telerik:RadScriptManager
ID
=
"RadScriptManager1"
runat
=
"server"
>
<
Scripts
>
<%--Needed for JavaScript IntelliSense in VS2010--%>
<%--For VS2008 replace RadScriptManager with ScriptManager--%>
<
asp:ScriptReference
Assembly
=
"Telerik.Web.UI"
Name
=
"Telerik.Web.UI.Common.Core.js"
/>
<
asp:ScriptReference
Assembly
=
"Telerik.Web.UI"
Name
=
"Telerik.Web.UI.Common.jQuery.js"
/>
<
asp:ScriptReference
Assembly
=
"Telerik.Web.UI"
Name
=
"Telerik.Web.UI.Common.jQueryInclude.js"
/>
</
Scripts
>
</
telerik:RadScriptManager
>
<
telerik:RadCodeBlock
ID
=
"RadCodeBlock1"
runat
=
"server"
>
<
script
type
=
"text/javascript"
>
function NavigatePrevYear() {
var calendar = $find("<%=RadCalendar1.ClientID%>");
var triplet = [calendar.FocusedDate[0] - 1, calendar.FocusedDate[1], calendar.FocusedDate[2]];
calendar.navigateToDate(triplet);
}
function NavigatePrevMonth() {
var calendar = $find("<%=RadCalendar1.ClientID%>");
var triplet = [calendar.FocusedDate[0], calendar.FocusedDate[1] - 1, calendar.FocusedDate[2]];
calendar.navigateToDate(triplet);
}
function NavigateNextMonth() {
var calendar = $find("<%=RadCalendar1.ClientID%>");
var triplet = [calendar.FocusedDate[0], calendar.FocusedDate[1] + 1, calendar.FocusedDate[2]];
calendar.navigateToDate(triplet);
}
function NavigateNextYear() {
var calendar = $find("<%=RadCalendar1.ClientID%>");
var triplet = [calendar.FocusedDate[0] + 1, calendar.FocusedDate[1], calendar.FocusedDate[2]];
calendar.navigateToDate(triplet);
}
function ViewChanged(sender, eventArgs) {
var step = eventArgs.get_step();
var msg = "The calendar moved ";
if (step <
0
) {
msg
= msg + "back ";
step = -step;
}
else
msg
= msg + "forward "
msg
= msg + step + " views.";
alert(msg);
}
</script>
</
telerik:RadCodeBlock
>
<
div
>
<
table
>
<
tr
>
<
td
>
<
telerik:RadButton
ID
=
"RadButton1"
runat
=
"server"
AutoPostBack
=
"false"
Text
=
"<<"
OnClientClicked
=
"NavigatePrevYear"
>
</
telerik:RadButton
>
<
telerik:RadButton
ID
=
"RadButton2"
runat
=
"server"
AutoPostBack
=
"false"
OnClientClicked
=
"NavigatePrevMonth"
Text
=
"<"
>
</
telerik:RadButton
>
<
telerik:RadButton
ID
=
"RadButton3"
runat
=
"server"
AutoPostBack
=
"false"
OnClientClicked
=
"NavigateNextMonth"
Text=">" >
</
telerik:RadButton
>
<
telerik:RadButton
ID
=
"RadButton4"
runat
=
"server"
AutoPostBack
=
"false"
Text=">>" OnClientClicked="NavigateNextYear" >
</
telerik:RadButton
>
</
td
>
</
tr
>
<
tr
>
<
td
>
<
telerik:RadCalendar
ID
=
"RadCalendar1"
runat
=
"server"
AutoPostBack
=
"true"
ShowRowHeaders
=
"false"
FocusedDate
=
"5/1/2012 12:00:00 AM"
EnableNavigation
=
"false"
>
<
ClientEvents
OnCalendarViewChanged
=
"ViewChanged"
/>
<
SpecialDays
>
<
telerik:RadCalendarDay
Repeatable
=
"Today"
Date
=
""
ItemStyle-CssClass
=
"rcToday"
>
<
ItemStyle
CssClass
=
"rcToday"
></
ItemStyle
>
</
telerik:RadCalendarDay
>
</
SpecialDays
>
</
telerik:RadCalendar
>
</
td
>
</
tr
>
</
table
>
</
div
>
</
form
>
</
body
>
</
html
>
There is no code behind required.
See this in action at
http://screencast.com/t/FmLWWjEE24N
Hope this helps!