Update DateInput

[sohrab]

I want to be able to change the value of the DateInput after the date has been selected. So my idea was to set the value of the DateInput when the client side OnDateSelected Event is firing.

<

rad:RadDatePicker ID="rdpDateSelector" runat="server" Skin="WebBlue" ClientEvents-OnDateSelected="rdpDateSelector_DateSelected">

</rad:RadDatePicker>

function

rdpDateSelector_DateSelected(sender, eventArgs)

{

jsDate = eventArgs._newValue;

$get(

"rdpDateSelector_dateInput_text").value = jsDate + " " + getSelectedTime();

}

Unfortunately it is not working due to the fact that AFTER the OnDateSelected Event is finished a handler is overwriting the DateInput Value with the following function: 

this.set_textBoxValue(this.get_editValue())

I found this piece of code while debugging the javascript code. How can I prevent that the DateInput textbox is overwritten by the Selected Date?

The reason why I am not using a DateTime Picker is that the selected Date and Time are both from different sources. The time frame (usually a block of 4 hours) is selected via a the telerik slider, and the date is selected via the datepicker. So when I am changing the value via the silder the DateInput is updated with a custom value (i. e. 10.09.2008 11:45 - 15:40). When someone is selecting a date only the date part should change and the time should stay as it is.

[Missing User]

Hello sohrab,


The RadDateInput control uses the get_selectedDate/set_selectedDate property to get/set its value. The following code examples show how to read the value of one RadDateInput control called "RadDateInput2" and use it to set the value of another, "RadDateInput1".

function CopyDateValue()
{
  var radDateInput1 = $find("<%= RadDateInput1.ClientID %>");
  var radDateInput2 = $find("<%= RadDateInput2.ClientID %>");
 radDateInput1.set_selectedDate(radDateInput2.get_selectedDate());
}

You can review the following help articles:

• RadDatePicker Client Object
• Getting and Setting Values
• RadDateInput Client Object

Best wishes,
Plamen
the Telerik team

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

[sohrab]

Hey Plamen,

thanks for your reply but this is not helping me.

First of all I dont want to display a selected date. I want to display a string i.e. "12.09.2008 15:45 - 20:45".
Secondly, the set_selectedDate function is firing the event "OnDateSelected" again, which then is blanking out my DateInput

Behind the scenes it still should set the selected date as it usually does... that's fine. The only thing I want to be able to do is to DISPLAY a custom string within the DateInput (textbox)

[Missing User]

Hello sohrab,



Please find attached a sample web application that demonstrates the needed approach.



Greetings,
Plamen
the Telerik team

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

[sohrab]

Thanks Plamen,

I see that your approach is different than mine (useage of a designated RadTextBox whereas I am using the RadDatePicker only, which comes along with a built in textfield).

In the Client Date Selected Event of the RadDatePicker I am able to update the textfield with a delay:

setTimeout(

function()

{

$get(

'rdpDateSelector_dateInput_text').value = jsDate + ' ' + getTimeRange();

$get(

'rdpDateSelector_dateInput_text').style.width = "150px";

}, 10);

The only thing that is still annoying me to death is that events are fired without me having defined any handlers. I.e. Clicking into the RadPicker Input field fires onFocus; leaving the field is firing the onBlur etc....
The onBlur for example is always firing the Clientside DateSelected event what lead to unexpected behaviour and refilled the field with inappropriate values.

But when I estimate the situation correctly then the only way to get around this is to set the width of the RadDatePicker Control to 1% and use a common Textbox instead. Is that correct?

[Missing User]

Hi sohrab,

You cannot use the following code:

$get(

'rdpDateSelector_dateInput_text').value = jsDate + ' ' + getTimeRange();

On the client side, the RadDatePicker uses get_selectedDate and set_selectedDate  to get or set its value.
You can workaround this by setting the width of the RadDatePicker Control to 1% and use a common RadTextBox instead.


Sincerely yours,
Plamen
the Telerik team

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

[sohrab]

I can use the code and it is working as expected.

The "1 px" solution is working fine in Firefox but fails in Internet Explorer. In IE it doesnt change anything.

Unforunately I cannot add a screenshot to my post else I would show you what I mean.

[Missing User]

Hi sohrab,


I tried to reproduce the problem in Internet Explorer, but to no avail. Can you please check the attached movie and let me know if I am missing something?

Regards,
Plamen
the Telerik team

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