get_rangeSelectionStartDate returns a Date object but FormatDate fails on it

4 posts, 0 answers
  1. Mircea
    Mircea avatar
    2 posts
    Member since:
    May 2013

    Posted 20 Jun 2013 Link to this post

    I don't know what I am doing wrong but I basically display a RadCalendar for a range selection:

    <telerik:RadCalendar runat="server" ID="RadCalendar1" RangeSelectionMode="ConsecutiveClicks"
                    EnableViewSelector="True" EnableKeyboardNavigation="True" SelectedDate="" Skin="Metro">
                    <ClientEvents OnDateClick="onDateClick"></ClientEvents>
                    <WeekendDayStyle CssClass="rcWeekend" />
                    <CalendarTableStyle CssClass="rcMainTable" />
                    <OtherMonthDayStyle CssClass="rcOtherMonth" />
                    <OutOfRangeDayStyle CssClass="rcOutOfRange" />
                    <DisabledDayStyle CssClass="rcDisabled" />
                    <SelectedDayStyle CssClass="rcSelected" />
                    <DayOverStyle CssClass="rcHover" />
                    <FastNavigationStyle CssClass="RadCalendarMonthView RadCalendarMonthView_Metro" />
                    <ViewSelectorStyle CssClass="rcViewSel" />
     </telerik:RadCalendar>

    the following code executes when onDateClick handler executes

    var rangeText = $("#RangeText");
    var rc = $find("RadCalendar1");
    var startDate = rc.get_rangeSelectionStartDate();
    var datepattern = 'MM/dd/yyyy';
    rangeText[0].value = rc.DateTimeFormatInfo.FormatDate(startDate, datepattern);


    The problem is that the value of the textbox is set to: "0undefined/0undefined/undefined" (returned by the FormatDate() method).
    If I take a look at the startDate value in the watch window it says: "Thu Jun 13 00:00:00 EDT 2013"
    However when I expand the startDate instance there's a [prototype] child with a value of "Invalid Date"
    Is this normal behavior? Why isn't the formatting working?

    Thank you.
  2. Vasil
    Admin
    Vasil avatar
    1547 posts

    Posted 21 Jun 2013 Link to this post

    Hi Mircea,

    The problem is that Telerik.Web.UI.Calendar.DateTimeFormatInfo.FormatDate works with Date Tripplet: array with 3 numbers for year, month and day. It does not work with the Date objects.

    You can create such triplet, and pass it to the FormatDate:
    var newDateTriplet = new Array();
    newDateTriplet.push(startDate.getFullYear());
    newDateTriplet.push(startDate.getMonth() + 1);
    newDateTriplet.push(startDate.getDate());
    rangeText[0].value = rc.DateTimeFormatInfo.FormatDate(newDateTriplet, datepattern);

    I hope this helps.

    Regards,
    Vasil
    Telerik
    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 the blog feed now.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Mircea
    Mircea avatar
    2 posts
    Member since:
    May 2013

    Posted 21 Jun 2013 Link to this post

    Ok, then you guys should correct your documentation a bit just to avoid any confusion.
    The column saying what the return type is, specifies Date but the description says it should return a triplet.
    Not an expert JavaScript programmer as you can tell but I figured it out looking at the FormatDate() source code that it only knows to handle those triplets. I ended up writing something similar with what you sent me.

    var rawStartDate = rc.get_rangeSelectionStartDate();
    var rawEndDate = rc.get_rangeSelectionEndDate();
    // translate Date into a DateTriplet [2013,10,29]
    var startDate = rawStartDate ? [rawStartDate.getFullYear(), rawStartDate.getMonth() + 1, rawStartDate.getDate()] : '';
    var endDate = rawEndDate ? [rawEndDate.getFullYear(), rawEndDate.getMonth() + 1, rawEndDate.getDate()] : '';


    At least your code confirms that how I did it is one of the correct ways of doing it.

    Thank you Vasil.
  5. Vasil
    Admin
    Vasil avatar
    1547 posts

    Posted 21 Jun 2013 Link to this post

    Hi Mircea,

    Thank you for your feedback. We will update the documentation and the prototype commends and summaries.

    To avoid confusion about the DateTimeFormatInfo in future reading of this thread I should share some more information:

    It seems that originally back in 2008, the Input control used DateTimeFormatInfo
    And later the Calendar had it's own DateTimeFormatInfo that was based on the input's that was done for parsing only dates, to be lightweight. It was changed to accept triplets, because of the internal functionality of the Calendar and to be a slightly faster, however the documentation was not properly updated at this point.
    The classes have the same name, but in fact they are different according to the needs of the controls and some performance optimizations:
    Telerik.Web.UI.DateParsing.DateTimeFormatInfo and
    Telerik.Web.UI.Calendar.DateTimeFormatInfo

    Regards,
    Vasil
    Telerik
    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 the blog feed now.
Back to Top