Client side calendars without jQuery.

[Eliot]

Hi,

Unfortunately due to the legacy software I'm attempting to integrate RAD controls into jQuery is not available to complete the following task:

These are also quite old versions of the controls but hopefully the principle is the same, the calendar is in the code as:

<radCln:RadDatePicker ID="dpDateFrom" runat="server"
                      Width="100px"
                      Calendar-Width="160px"
                      Calendar-DayNameFormat="FirstLetter"
                      Calendar-EnableMultiSelect="false"
                      Calendar-ShowRowHeaders="false"
                      Calendar-ShowColumnHeaders="true">
    <ClientEvents OnDateSelected="OnFromDateSelected" OnPopupUpdating="OnFromDateSelected" />
    <Calendar runat="server" Skin="Default">
        <SpecialDays>
            <radCln:RadCalendarDay Date="" Repeatable="Today">
                <ItemStyle BackColor="#e0e0e0" />
            </radCln:RadCalendarDay>
        </SpecialDays>
    </Calendar>
</radCln:RadDatePicker>

When the OnFromDateSelected event is fired the following code is called:

function OnFromDateSelected(sender, e) {

        // The from date picker input.
        var fromDatePicker = document.getElementById("<%= dpDateFrom.ClientID%>");
        var fromDateCalendar = document.getElementById("<%= dpDateFrom.ClientID%>" + "_calendar");
        fromDateCalendar.get_selectedDate();
        // The to date picker input.
        var toDatePicker = document.getElementById("<%= dpDateTo.ClientID%>");
}

The problem I have is that the sender is a RadDatePicker object but I can't get a reference to anything but a HTML Table or Input using Javascript and the DOM. Any idea if it's possible to get the object you can use the method .get_selectedDate() on through vanilla Javascript?

[Vasil]

Hello Eliot,

The document.getElementById will return DOM element.

If you need the client object use the $find to find it like:

var object = $find("<%= dpDateFrom.ClientID%>");

Also you can use sender.get_calendar() to access the object of the calendar if your sender is the picker.

Regards,
Vasil
Telerik

 

 

[Eliot]

Hi Vasil,

Thanks for your reply, I was confused why your reply appeared to contain jQuery but then I did a little more investigation.

For those who are similarly confused the '$find' method is an asp.net function rather than jQuery.

Thanks again,

Eliot.