Set the time in radtimepicker from javascript

[Hrushikesh Mokashi]

Hi All,

I am using RadTimePicker.

I want to set the time in RadTimepicker from javascript.
Please help me.

Thanks

[Daniel]

Hello Hrushikesh,

Test the following approach:

var timePicker = $find('<%= RadTimePicker1.ClientID %>');
timePicker.get_dateInput().set_value("01:00 PM");

RadTimePicker Client Object
RadDateInput Client Object

Best regards,
Daniel
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

[Hrushikesh Mokashi]

Hi,

Thanks
The solution work.

[provident]

This is the solution I'm looking for as well, however I receive the message "object doesn't support this property or method" when I do the timePicker.get_dateInput().set_value()  function. I actually receive this message any time I use the timePicker.get_ or set_ functions. My release is 2.2.4.

What I am trying to accomplish is to set the time field to 00:00:00 after some javascript validation from the OnDateSelected event that is using the SharedTimeView. If I select the time input textbox on the screen and click the Delete key, this provides me with exactly what I'm expecting - "00:00:00". I just haven't been able to accomplish the same thing from JavaScript client-side code.

The only thing that has worked so far is the timePicker.SetInputDate('') function, but this causes another postback. I was able to do a timePicker.GetTextBox from the DateInputID control and set the .innerText to null, which does clear the field on the screen, but somehow the original time value is still left in args.OldValue. I've been struggling with this for several days to no avail. Any help would be greatly appreciated.

Thanks,
Steve M. Dorris

[provident]

OK, I was able to accomplish my desired results with the following code, where (sender) is the RadTimePicker control. Just thought I'd publish the code in case it helped anyone else.

function ClearTextBox(sender) {
 var rtp = $get(sender.ClientID) ;
 rtp.value = '';

 var rtpDateInput = $get(sender.DateInputID);
 rtpDateInput.value = '';

 var rtpTextBox = sender.GetTextBox(rtpDateInput);
 rtpTextBox.innerText = '';
}

By the way, we've been using your Calender control in our commercial timesheet app for two years now and have received rave reviews. Thanks for a great product. We are now incorporting the RadTimePicker.

Steve M. Dorris

[Chandan Dey]

Hi Daniel,

I am always getting null when use $find with my radtimepicker.

My Control :
<telerik:RadTimePicker ID="txtServiceTime" runat="server" Width="180px">
<DateInput runat="server" ID="DateInput" DateFormat="HH:mm" DisplayDateFormat="HH:mm" >
         <ClientEvents  OnLoad="onLoad" />
</DateInput>
</telerik:RadTimePicker>

My Javascript :
        function onLoad(sender, args) {
            debugger;
            var time = new Date();
            var hours = time.getHours();
            var minutes = time.getMinutes();
            minutes = ((minutes < 10) ? "0" : "") + minutes;
            var clock = hours + ":" + minutes; //  + ":" + seconds
            var time = new Date();
            if (document.getElementById('<%= hdnClientTime.ClientID %>').value == "1") {
                var timePicker = $find('<%= txtServiceTime.ClientID %>');
                timePicker.get_dateInput().set_value(hours + ':' + minutes);
                //time.setHours(hours);
                //time.setMinutes(minutes);

              //timePicker.value(/time);
            }
        }

[Princy]

Hello,

It shows null because the control was not rendered on OnLoad event. So you can access it using sender as shown below.

JS:

<script type="text/javascript">
  function onLoad(sender, args)
   {
     var time = new Date();
       ...  ...   ...
     sender.set_textBoxValue(clock);
   }
 </script>

Thanks,
Princy.

[Chandan Dey]

Hi Princy

First of all thanks a lot. It really working for me.

But there was a problem after populate the time in radtimepicker control if i click on that radtimepicker the value is erased.
And at the time of save the data in database SelectedDate property is null and i am using InvalidTextBoxValue prpperty to save in database it will work but is it a actual procedure to set client time in radtimepicker when a page load.

Thanks
Chandan
 

[Princy]

Hello,

I suppose you want to store the current time in DB. So one suggestion is you can store that time in a Hiddenfield and access that in server side. Here is the sample code.
JS:

function onLoad(sender, args)
 {
    ...  ...  ...
  var clock = hours + ":" + minutes;
  sender.set_textBoxValue(clock);
  document.getElementById("Hiddenfield1").value = clock;
 }

CS:

protected void btn_Click(object sender, EventArgs e)
  {
    string ctime= Hiddenfield1.Value;
  }

Thanks,
Princy.