This is a migrated thread and some comments may be shown as answers.

RadDatePicker If changes the month ondayrender not working

9 Answers 200 Views
Calendar
This is a migrated thread and some comments may be shown as answers.
Vignesh
Top achievements
Rank 1
Vignesh asked on 17 Jul 2012, 02:27 PM
Hi , Can any one help me, i'm using RadDatePicker in this , i blocking some special days. special days blocking are working fine if i change the month from july to august its working fine . if i again change to august to july code blocking is there but images for that special days are not working. I'm also using autopostback="true".  Here my code
    <telerik:RadCodeBlock ID="myCodeBlock" runat="server">
        <script type="text/javascript">
            //<![CDATA[
            function rdpDay_OnDateSelected(sender, e) {
                var myId = document.getElementById("<%= ddlTime.ClientID %>");
                if (myId != null) {
                    myId.style.display = "none";
                }
                document.getElementById("<%= hfHideValue.ClientID %>").value = "Hidden";
            }
 
            // 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.Date[0], args.Date[1] - 1, args.Date[2]);
                var jsDate = new Date(args._date[0], args._date[1] - 1, args._date[2]);
                var disabledDays = document.getElementById("ctl00_cphMaster_hdDisableWeek").value;
                var mySplitResult = disabledDays.split(",");
                for (i = 0; i < mySplitResult.length; i++) {
                    if (jsDate.getDay() == parseInt(mySplitResult[i])) {
                        var otherMonthCssClass = "ColorGray";
                        args._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._cell.innerHTML = "<span>" + args._date[2] + "</span>";
                        // disable selection and hover effect for the cell
                        args._cell.DayId = "";
                        break;
                    }
                }
 
                var blockedDays = document.getElementById("ctl00_cphMaster_hdBlockDays").value;
                var mySplitBlockDaysResult = blockedDays.split(",");
                for (i = 0; i < mySplitBlockDaysResult.length; i++) {
                    var d = new Date(mySplitBlockDaysResult[i]);
                    if (jsDate.toString() == d.toString()) {
                        var otherMonthCssClass = "ColorRed";
                        args._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._cell.innerHTML = "<span>" + args.Date[2] + "</span>";
                        // disable selection and hover effect for the cell
                        args._cell.DayId = "";
                        break;
                    }
                }
            }
            //]]>
        </script>
    </telerik:RadCodeBlock>
 
<telerik:RadDatePicker ID="rdpDay" AutoPostBack="true" runat="server" CssClass="txtStyl" Width="120px"
                                                            Skin="Office2007">
                                                            <DateInput ID="DateInput1" DisplayDateFormat="dd/MM/yyyy" DateFormat="dd/MM/yyyy"
                                                                FocusedStyle-CssClass="txtStyl" EnabledStyle-CssClass="txtStyl" HoveredStyle-CssClass="txtStyl"
                                                                EmptyMessage="dd/mm/yyyy" ForeColor="#666666" Font-Names="Arial,Helvetica,sans-serif"
                                                                HideOnBlur="True" runat="server" ReadOnly="true" Style="font-size: 11pt; width: 75px;">
                                                            </DateInput>
                                                            <Calendar OnDayRender="Calendar_OnDayRender" AutoPostBack="true" runat="server" Skin="Office2007">
                                                                <ClientEvents OnDayRender="OnDayRender" />
                                                            </Calendar>
                                                            <ClientEvents OnDateSelected="rdpDay_OnDateSelected" />
                                                        </telerik:RadDatePicker>
protected void Calendar_OnDayRender(object sender, Telerik.Web.UI.Calendar.DayRenderEventArgs e)
    {
        if (enableWeek == null)
        {
            if (ViewState["enableWeek"] != null)
                enableWeek = (StringBuilder)ViewState["enableWeek"];
        }
 
        if (myBlockDays == string.Empty)
        {
            if (ViewState["myBlockDays"] != null)
                myBlockDays = ViewState["myBlockDays"].ToString();
        }
 
        if (enableWeek != null)
        {
            string[] iEnableWeek = enableWeek.ToString().Split(',');
 
            string[] iDisableWeek = new string[7] { "0", "1", "2", "3", "4", "5", "6" };
 
            for (int i = 0; i < iDisableWeek.Length; i++)
            {
                for (int j = 0; j < iEnableWeek.Length; j++)
                {
                    if (iEnableWeek[j].Trim() == iDisableWeek[i])
                    {
                        iDisableWeek[i] = "";
                        break;
                    }
                }
            }
 
            for (int i = 0; i < iDisableWeek.Length; i++)
            {
                if (iDisableWeek[i] != "")
                {
                    // 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)Convert.ToInt32(iDisableWeek[i]))
                    {
                        // if you are using the skin bundled as a webresource("Default"), the Skin property returns empty string
                        string otherMonthCssClass = "ColorGray";
 
                        // clear the default cell content (anchor tag) as we need to disable the hover effect for this cell
                        e.Cell.Controls.Clear();
                        e.Cell.Text = "";
                        e.Cell.Enabled = false;
                        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
                        Label label = new Label();
                        label.Text = e.Day.Date.Day.ToString();
                        e.Cell.Controls.Add(label);
 
                        // disable the selection for the specific day
                        RadCalendarDay calendarDay = new RadCalendarDay();
                        calendarDay.Date = e.Day.Date;
                        calendarDay.IsSelectable = false;
                        calendarDay.ItemStyle.CssClass = otherMonthCssClass;
                        rdpDay.Calendar.SpecialDays.Add(calendarDay);
                        break;
                    }
                }
            }
 
            string[] iBlockDays = myBlockDays.ToString().Split(',');
            for (int i = 0; i < iBlockDays.Length; i++)
            {
                if (iBlockDays[i].Trim() != "")
                {
                    if (e.Day.Date == Convert.ToDateTime(iBlockDays[i].Trim()))
                    {
                        // if you are using the skin bundled as a webresource("Default"), the Skin property returns empty string
                        string otherMonthCssClass = "ColorRed";
 
                        // 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
                        Label label = new Label();
                        label.Text = e.Day.Date.Day.ToString();
                        e.Cell.Controls.Add(label);
 
                        // disable the selection for the specific day
                        RadCalendarDay calendarDay = new RadCalendarDay();
                        calendarDay.Date = e.Day.Date;
                        calendarDay.IsSelectable = false;
                        calendarDay.ItemStyle.CssClass = otherMonthCssClass;
                        rdpDay.Calendar.SpecialDays.Add(calendarDay);
                        break;
                    }
                }
            }
        }
    }

9 Answers, 1 is accepted

Sort by
0
Vignesh
Top achievements
Rank 1
answered on 21 Jul 2012, 10:29 AM
Any Updates ????????
0
Vasil
Telerik team
answered on 24 Jul 2012, 11:40 AM
Hello Vignesh,

There was and bug that we found inside the styles collections for each day of the calendar, that is serialized from server to client if you set styles on OnDayRender server side event.
You can update tomorrow to the Service Pack of Q2 2012 when it become available and see if the problem will be resolved.

Greetings,
Vasil
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
0
Neil
Top achievements
Rank 1
answered on 02 Nov 2012, 04:17 PM
Just so you know, this problem is still there.
0
Vasil
Telerik team
answered on 05 Nov 2012, 08:22 AM
Hi Osama,

Could you tell us your version of the controls and describe the exact problem. The bug mentioned earlier in this discussion is already fixed so if you have similar problem it is caused by something else.

Greetings,
Vasil
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
0
Neil
Top achievements
Rank 1
answered on 05 Nov 2012, 10:08 AM
I have upgraded to the latest version (2012 Q3), but the problem is still there.

When doing:
Private Sub RadCalendar1_DayRender(sender As Object, e As Telerik.Web.UI.Calendar.DayRenderEventArgs) Handles RadCalendar1.DayRender
      If e.Day.Date = Now.Date Then
          e.Cell.CssClass = "MyTestClass"
      End If
  End Sub

The css of the cell becomes 'MyTestClass' but, when the day is selected, the css class is 'rcSelected' when it should be 'rcSelected MyTestClass'. Also, when the mouse is over the day, the css is 'rcHover' when it should be 'rcHover MyTestClass'.

0
Vasil
Telerik team
answered on 05 Nov 2012, 12:03 PM
Hello Osama,

Indeed it is not the same bug. The issue that you are having is currently a limitation in the RadCalendar. If
you add class for the Cell it will remain only for the Enabled state. And on hover it will apply the hover style.
You could try to implement your logic ClientSide on the Client OnDayRender. See the JavaScript in this demo that might help you to achieve it.

In future we are planing to implement mode in which all styles will be added instead of replaced.
In this way, during focus you will see 'rcSelected MyTestClass'. and during hover you will see 'rcHover MyTestClass'. If hover selected cell it will be even 'rcSelected rcHover MyTestClass'. Hopefully for the next major release we will have this implemented.

Kind regards,
Vasil
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
0
Neil
Top achievements
Rank 1
answered on 05 Nov 2012, 03:57 PM
The javascript solution doesn't work neither, another Telerik JS function (the one that replace the css class on 'onmouseout') overrides my own fuynction (your event must be triggered after mine).

If you decide the change this behaviour (like you said, add our css class rather than replacing it) that would be brilliant and solve quite a lot of issues. Honnestly, all the other telerik controls work like that so I don't see why the RadCalendar would be an exeption. 

Any idea of when the next release is going to happen? Shall I worry about it and work on a solution myself or is this new functionality really going to happen in the next release? PLEASE take in consideration that this is important for the relase or my product.
I can wait for the next release only if you can guarranty that is behaviour is going to happen.

Do you want me to open a support ticket? May be it will be looked at in higher priority?

Regards.
0
Neil
Top achievements
Rank 1
answered on 05 Nov 2012, 03:59 PM
I'm just thinking, maybe I can override the 'onmouseout' event?

0
Vasil
Telerik team
answered on 07 Nov 2012, 09:50 AM
Hello Osama,

The next release will be around mid of February. (The service pack of the current release will be sooner, it will not include the new functionality).

Overriding the onmouseover might work, but I could not guarantee. Currently we don't have any know tested workaround for the issue.

Kind regards,
Vasil
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
Tags
Calendar
Asked by
Vignesh
Top achievements
Rank 1
Answers by
Vignesh
Top achievements
Rank 1
Vasil
Telerik team
Neil
Top achievements
Rank 1
Share this question
or