Highlight the today day

[Udi]

Hello,

I have a RadDatePicker control with footer that contain 2 buttons.One named "Today" and second named "OK" 
1. How can i highlight the today day on the calendar when i click the button( with java script) ?
    I do not want to toggle the calendar when i click the "Today" button, only highlight the current day on the calendar.
2. When i click on the "OK" button i want to put the selected date value  in the textbox and  toggle the calendar.
3. If i click on any date in the calendar i do not want to toggle the calendar (only the "OK" button toggle the calendar).


I need it in client side (JS).

Thank you,
Oren

[Radoslav]

Hi Oren,

I am sending you a simple example which demonstrates the desired functionality. Please check it out and let me know if it helps you.

Greetings,
Radoslav
the Telerik team

[Udi]

Hello Radoslav,

Thank you for your response.

I have examined your attach sample and it almost what i was looking for.
The today button works well,but when i click on any date on the calendar i need it highlighted and only when i click on "OK" it should be toggle.
The "OK" button works well (the calendar get toggle) but when i click on any date on the calendar it doesn't get highlight (The OnDateClick event prevent it).
I need it highlight but not toggle.The "OK" will set the date on the textbox and hides the popup.

Regards,
Oren

[Radoslav]

Hi Oren,

I am sending you the modified example. Please check it out and let me know if it helps you.

Kind regards,
Radoslav
the Telerik team

[Rayne]

This is what I was looking for, so thanks. But i do have one question...

My page has two datetimepickers that I'd like to use the Today function on. Is there anyway I can use the same js function but just pass the ClientID as a parameter so that both controls can use it?

[Shinu]

Hello,


I had a scenario where I needed similar functionality for multiple datepickers. I tried following approach to get it working.

ASPX:

<telerik:RadDatePicker runat="server" ID="RadDatePicker1">
    <Calendar ID="Calendar1" runat="server">
        <FooterTemplate>
            <asp:Button runat="server" Text="Today" OnClientClick="todayButtonClick('1'); return false;"
                ID="Button1" />
            <asp:Button runat="server" Text="OK" OnClientClick="okButtonClick('1'); return false;"
                ID="Button2" />
        </FooterTemplate>
    </Calendar>
</telerik:RadDatePicker>
<br />
<telerik:RadDatePicker runat="server" ID="RadDatePicker2">
    <Calendar ID="Calendar2" runat="server">
        <FooterTemplate>
            <asp:Button runat="server" Text="Today" OnClientClick="todayButtonClick('2'); return false;"
                ID="Button1" />
            <asp:Button runat="server" Text="OK" OnClientClick="okButtonClick('2'); return false;"
                ID="Button2" />
        </FooterTemplate>
    </Calendar>
</telerik:RadDatePicker>

Client code:

<script type="text/javascript">
    var currentDate;
    function todayButtonClick(pickerID) {
        if (pickerID == 1) {
            var calendar = $find("<%=RadDatePicker1.ClientID  %>");
        }
        else {
            var calendar = $find("<%=RadDatePicker2.ClientID  %>");
        }
        currentDate = new Date();
        calendar._setCalendarDate(currentDate);
    }

    function okButtonClick(pickerID) {
        if (pickerID == 1) {
            var calendar = $find("<%=RadDatePicker1.ClientID  %>");
        }
        else {
            var calendar = $find("<%=RadDatePicker2.ClientID  %>");
        }
        calendar.set_selectedDate(currentDate);
        calendar.hidePopup();
    }
</script>

 
Best of luck.. :)

-Shinu.

[Rayne]

Thanks! That's just what I needed.