RadDatePicker If changes the month ondayrender not working

10 posts, 0 answers
  1. Vignesh
    Vignesh avatar
    12 posts
    Member since:
    Nov 2011

    Posted 17 Jul 2012 Link to this post

    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;
                        }
                    }
                }
            }
        }
  2. Vignesh
    Vignesh avatar
    12 posts
    Member since:
    Nov 2011

    Posted 21 Jul 2012 Link to this post

    Any Updates ????????
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Vasil
    Admin
    Vasil avatar
    1547 posts

    Posted 24 Jul 2012 Link to this post

    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.
  5. Osama Khattab
    Osama Khattab avatar
    6 posts
    Member since:
    Apr 2010

    Posted 02 Nov 2012 Link to this post

    Just so you know, this problem is still there.
  6. Vasil
    Admin
    Vasil avatar
    1547 posts

    Posted 05 Nov 2012 Link to this post

    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.
  7. Osama Khattab
    Osama Khattab avatar
    6 posts
    Member since:
    Apr 2010

    Posted 05 Nov 2012 Link to this post

    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'.

  8. Vasil
    Admin
    Vasil avatar
    1547 posts

    Posted 05 Nov 2012 Link to this post

    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.
  9. Osama Khattab
    Osama Khattab avatar
    6 posts
    Member since:
    Apr 2010

    Posted 05 Nov 2012 Link to this post

    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.
  10. Osama Khattab
    Osama Khattab avatar
    6 posts
    Member since:
    Apr 2010

    Posted 05 Nov 2012 Link to this post

    I'm just thinking, maybe I can override the 'onmouseout' event?

  11. Vasil
    Admin
    Vasil avatar
    1547 posts

    Posted 07 Nov 2012 Link to this post

    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.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017