Howdy,
I can't seem to get the disabled days function to be working after I combined it with the Data Selector Range Demo (http://demos.telerik.com/aspnet-ajax/calendar/examples/functionality/rangeselection/defaultcs.aspx)
DefaultVB.aspx
DefaultVB.aspx.vb
I can't seem to get the disabled days function to be working after I combined it with the Data Selector Range Demo (http://demos.telerik.com/aspnet-ajax/calendar/examples/functionality/rangeselection/defaultcs.aspx)
DefaultVB.aspx
<%@ Page CodeFile="DefaultVB.aspx.vb" Language="vb" AutoEventWireup="false" Inherits="testlayouts_samples_rangeselection_DefaultVB" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<
html
xmlns
=
'http://www.w3.org/1999/xhtml'
>
<
head
>
<
title
>ASP.NET Calendar Demo - Range Selection</
title
>
</
head
>
<
body
>
<
form
id
=
"form1"
runat
=
"server"
>
<
telerik:RadScriptManager
runat
=
"server"
ID
=
"RadScriptManager1"
/>
<
telerik:RadSkinManager
ID
=
"QsfSkinManager"
runat
=
"server"
ShowChooser
=
"true"
/>
<
telerik:RadFormDecorator
ID
=
"QsfFromDecorator"
runat
=
"server"
DecoratedControls
=
"All"
EnableRoundedCorners
=
"false"
/>
<
telerik:RadCodeBlock
ID
=
"RadCodeBlock1"
runat
=
"server"
>
<
script
type
=
"text/javascript"
>
// necessary to disable the weekends on client-side navigation
function OnDayRender(calendarInstance, args) {
// convert the date-triplet to a javascript date
// we need Date.getDay() method to determine
// which days should be disabled (e.g. every Saturday (day = 6) and Sunday (day = 0))
var jsDate = new Date(args.get_date()[0], args.get_date()[1] - 1, args.get_date()[2]);
if (jsDate.getDay() == 0 || jsDate.getDay() == 6) {
var otherMonthCssClass = "rcOutOfRange";
args.get_cell().className = otherMonthCssClass;
// replace the default cell content (anchor tag) with a span element
// that contains the processed calendar day number -- necessary for the calendar skinning mechanism
args.get_cell().innerHTML = "<
span
>" + args.get_date()[2] + "</
span
>";
// disable selection and hover effect for the cell
args.get_cell().DayId = "";
}
}
</
script
>
<
telerik:RadAjaxLoadingPanel
runat
=
"server"
ID
=
"RadAjaxLoadingPanel1"
>
</
telerik:RadAjaxLoadingPanel
>
</
telerik:RadCodeBlock
>
<
h3
class
=
"qsfSubtitle"
>Multi Month View with enabled AutoPostBack</
h3
>
<
table
>
<
tr
>
<
td
colspan
=
"2"
>
<
label
for
=
"RaddatePicker1"
>Start Date: </
label
>
<
telerik:RadDatePicker
runat
=
"server"
ID
=
"RadDatePicker1"
>
</
telerik:RadDatePicker
>
<
label
for
=
"RadDatePicker2"
>End Date: </
label
>
<
telerik:RadDatePicker
runat
=
"server"
ID
=
"RadDatePicker2"
>
</
telerik:RadDatePicker
>
<
asp:Button
runat
=
"server"
ID
=
"Button1"
Text
=
"Set range"
OnClick
=
"Button1_Click"
>
</
asp:Button
>
</
td
>
</
tr
>
</
table
>
<
br
/>
<
telerik:RadCalendar
runat
=
"server"
ID
=
"RadCalendar2"
AutoPostBack
=
"true"
MultiViewColumns
=
"2"
MultiViewRows
=
"1"
RangeSelectionMode
=
"ConsecutiveClicks"
EnableViewSelector
=
"true"
OnDayRender
=
"Calendar_OnDayRender"
>
</
telerik:RadCalendar
>
<
br
/>
<
telerik:RadAjaxManager
ID
=
"RadAjaxManager1"
runat
=
"server"
DefaultLoadingPanelID
=
"RadAjaxLoadingPanel2"
>
<
AjaxSettings
>
<
telerik:AjaxSetting
AjaxControlID
=
"RadDatePicker1"
>
<
UpdatedControls
>
<
telerik:AjaxUpdatedControl
ControlID
=
"RadCalendar2"
UpdatePanelCssClass
=
""
/>
</
UpdatedControls
>
</
telerik:AjaxSetting
>
<
telerik:AjaxSetting
AjaxControlID
=
"RadDatePicker2"
>
<
UpdatedControls
>
<
telerik:AjaxUpdatedControl
ControlID
=
"RadCalendar2"
UpdatePanelCssClass
=
""
/>
</
UpdatedControls
>
</
telerik:AjaxSetting
>
<
telerik:AjaxSetting
AjaxControlID
=
"Button1"
>
<
UpdatedControls
>
<
telerik:AjaxUpdatedControl
ControlID
=
"RadCalendar2"
UpdatePanelCssClass
=
""
/>
</
UpdatedControls
>
</
telerik:AjaxSetting
>
<
telerik:AjaxSetting
AjaxControlID
=
"RadCalendar2"
>
<
UpdatedControls
>
<
telerik:AjaxUpdatedControl
ControlID
=
"RadDatePicker1"
UpdatePanelCssClass
=
""
/>
<
telerik:AjaxUpdatedControl
ControlID
=
"RadDatePicker2"
UpdatePanelCssClass
=
""
/>
</
UpdatedControls
>
</
telerik:AjaxSetting
>
</
AjaxSettings
>
</
telerik:RadAjaxManager
>
<
telerik:RadAjaxLoadingPanel
ID
=
"RadAjaxLoadingPanel2"
runat
=
"server"
Skin
=
"Default"
>
</
telerik:RadAjaxLoadingPanel
>
</
form
>
</
body
>
</
html
>
DefaultVB.aspx.vb
Imports Telerik.Web.UI
Partial Class testlayouts_samples_rangeselection_DefaultVB
Inherits System.Web.UI.Page
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
' necessary not to repeat the special days on postback
If Not Page.IsPostBack Then
RadDatePicker1.Calendar.SpecialDays.Clear()
End If
End Sub
Protected Sub Button1_Click(ByVal sender As Object, ByVal e As EventArgs)
If RadDatePicker1.SelectedDate.HasValue AndAlso RadDatePicker2.SelectedDate.HasValue Then
RadCalendar2.RangeSelectionStartDate = RadDatePicker1.SelectedDate.Value
RadCalendar2.RangeSelectionEndDate = RadDatePicker2.SelectedDate.Value
Else
'RadAjaxpanel1.Alert("To set range of dates in RadCalendar you need to choose both Start and End date")
RadAjaxManager1.Alert("To set range of dates in RadCalendar you need to choose both Start and End date")
End If
End Sub
Protected Overrides Sub OnPreRender(ByVal e As EventArgs)
MyBase.OnPreRender(e)
Dim calendarMinDate As New DateTime(1980, 1, 1)
Dim calendarMaxDate As New DateTime(2099, 12, 30)
If RadCalendar2.RangeSelectionStartDate <> calendarMinDate AndAlso RadCalendar2.RangeSelectionEndDate <> calendarMaxDate Then
RadDatePicker1.SelectedDate = RadCalendar2.RangeSelectionStartDate
RadDatePicker2.SelectedDate = RadCalendar2.RangeSelectionEndDate
Else
RadDatePicker1.Clear()
RadDatePicker2.Clear()
End If
End Sub
' necessary to disable the weekend days on first page load
Protected Sub Calendar_OnDayRender(ByVal sender As Object, ByVal e As Telerik.Web.UI.Calendar.DayRenderEventArgs)
' modify the cell rendered content for the days we want to be disabled (e.g. every Saturday and Sunday)
If (e.Day.Date.DayOfWeek = DayOfWeek.Saturday Or e.Day.Date.DayOfWeek = DayOfWeek.Sunday) Then
' if you are using the skin bundled as a webresource("Default"), the Skin property returns empty string
Dim calendarSkin = RadDatePicker1.Calendar.Skin
If (calendarSkin = "") Then
calendarSkin = "Default"
End If
Dim otherMonthCssClass As String = "rcOutOfRange"
' clear the default cell content (anchor tag) as we need to disable the hover effect for this cell
e.Cell.Text = ""
e.Cell.CssClass = otherMonthCssClass ' set new CssClass for the disabled calendar day cells (e.g. look like other month days here)
' render a span element with the processed calendar day number instead of the removed anchor -- necessary for the calendar skinning mechanism
Dim label As Label = New Label
label.Text = e.Day.Date.Day.ToString
e.Cell.Controls.Add(label)
' disable the selection for the specific day
Dim calendarDay As RadCalendarDay = New RadCalendarDay
calendarDay.Date = e.Day.Date
calendarDay.IsSelectable = False
calendarDay.ItemStyle.CssClass = otherMonthCssClass
RadDatePicker1.Calendar.SpecialDays.Add(calendarDay)
End If
End Sub
End Class