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

Setting value of RadDatePicker with Javascript

5 Answers 2790 Views
Calendar
This is a migrated thread and some comments may be shown as answers.
Colin
Top achievements
Rank 1
Colin asked on 22 Jun 2009, 09:19 PM
Hi

Can anyone please tell me how to set the value of the RadDatePicker using Javascript?

Thanks

Colin

5 Answers, 1 is accepted

Sort by
0
Shinu
Top achievements
Rank 2
answered on 23 Jun 2009, 04:24 AM
Hi Colin,

Use the set_selectedDate() method of raddatepicke in order to set the value from client side.

ASPX:
 
<telerik:RadDatePicker ID="RadDatePicker1" runat="server">  
</telerik:RadDatePicker> 
<input id="Button1" type="button" value="Set Date" onclick="SetDate();" /> 

JavaScript:
 
<script type="text/javascript"
function SetDate() 
    dateVar = new Date(); 
    var datepicker = $find("<%= RadDatePicker1.ClientID %>"); 
    datepicker.set_selectedDate(dateVar); 
</script> 

Checkout the following link to know more about clientside methods of raddatepicker.
Client-Side Basics
RadDatePicker Client Object

Thanks,
Shinu.
0
Colin
Top achievements
Rank 1
answered on 23 Jun 2009, 11:01 AM
Hi Shinu

That's great.

Thanks very much for your help

Colin
0
Joel R
Top achievements
Rank 1
answered on 24 Sep 2012, 07:10 PM

In order for the above to work the control must be enabled.  In my scenario I used the RadDateTimePicker and wanted the control to be enabled='false' but then the javascript did not set the value. telerik version 2011.1.519.35

telerik:RadDateTimePicker ID="RadDateTimePickerStop" Enabled="true" runat="server"

 

 

 

0
Mark
Top achievements
Rank 1
answered on 25 Nov 2015, 03:59 PM
Can you explain why this works with $find, but not with document.getElementById?
0
Marin Bratanov
Telerik team
answered on 26 Nov 2015, 06:58 AM

Hi Mark,

This is the way MS AJAX works. The client-side objects of IScriptControls (such as ours) are referenced by the $find() method: https://msdn.microsoft.com/library/bb397441(v=vs.100).aspx because it returns the component object with all its special API.

document.getElementById() returns a DOM object, which is not the same.

the control property of that DOM object is what $find() returns, so you can use something like as base for comparison:

<telerik:RadDateTimePicker runat="server" ID="RadDateTimePicker1"></telerik:RadDateTimePicker>
<script>
    function alertReference() {
        var domObj = document.getElementById("<%=RadDateTimePicker1.ClientID%>");
        var component = domObj.control;
        var dtp = $find("<%=RadDateTimePicker1.ClientID%>");
        console.log(component === dtp);
        console.log(component);
        Sys.Application.remove_load(alertReference);
    }
    Sys.Application.add_load(alertReference);
</script>

Regards,

Marin Bratanov
Telerik
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
Tags
Calendar
Asked by
Colin
Top achievements
Rank 1
Answers by
Shinu
Top achievements
Rank 2
Colin
Top achievements
Rank 1
Joel R
Top achievements
Rank 1
Mark
Top achievements
Rank 1
Marin Bratanov
Telerik team
Share this question
or