Rad DatePicker - Clear() only working client side

[Brad]

I have a form inside of a modal Rad Window.

One of the controls on this form is a Rad DatePicker.

There is a button on this form that I have added to clear the form fields. The javascript code that clears the DatePicker looks like this.

var StartDatePicker = $find("<%= dpStartDate.ClientID %>");
StartDatePicker.clear();

On the form, this works. The date value disappears.

Now, if I hit the button that closes the Window and posts back the form data, this line of code...

Start_Date = Convert.ToDateTime(dpStartDate.SelectedDate);

... shows me that the date value is still in the Rad DatePicker

I have even tried hard coding the clearing of the DatePicker's text box .

$("[id*='dpStartDate_dateInput_text']").val('');

This line alone works in clearing the date from the form. But again when I read this control from the code behind, the value is still there,

What might be the cause of this?

[Vasil]

Hi Brad,

What version of the controls do you use? Because I did not succeed in replicating the issue using the latest RadControls.

Here is the code that I wrote:

<telerik:RadCodeBlock runat="server">
  <script type="text/javascript">

    function clearThePicker() {
      var StartDatePicker = $find("<%= StartDatePicker.ClientID %>");
      StartDatePicker.clear();
    }

  </script>
</telerik:RadCodeBlock>
<script runat="server" type="text/C#">
  protected void Button1_Click(object sender, EventArgs e)
  {
    if (StartDatePicker.SelectedDate != null)
    {
      SelectedDate.Text = StartDatePicker.SelectedDate.ToString();
    }
    else
    {
      SelectedDate.Text = "null";
    }
  }
</script>
<telerik:RadDatePicker runat="server" ID="StartDatePicker">
</telerik:RadDatePicker>
<button onclick="clearThePicker();return false;">
  clear</button>
<asp:Button runat="server" ID="Button1" OnClick="Button1_Click" Text="PostBack" />
<asp:Label ID="SelectedDate" runat="server" Text="Label"></asp:Label>

When post-back after clicking the 'clear' button the StartDatePicker.SelectedDate is null.

Please check that ViewState of the dpStartDate control is enabled.
Also make sure not to assign any value for the dpStartDate in the code-behind before getting it's selected day.

I hope this helps.

Greetings,
Vasil
the Telerik team

[Margie]

Hi Vasil,

I tried to use the solution you provided. It is working properly when the datepicker has a valid date. but if it doesn't, the value is not clearing out. I am using version 2013.2.717.40. Thanks

[Vasil]

Hi Margie,

If the value is invalid, the selected_date is already null. If you want to remove the error state you can use this approach using the set_invalid property of the date input of the picker.

$find("idOfYourPicker")._dateInput.set_invalid(false);
$find("idOfYourPicker").clear();

Regards,
Vasil
Telerik

[Margie]

Thank you. Worked like a charm. Thanks for the help.