Clearing RadDatePicker Date On Client

[Brian Mains]

Hello,

How do you clear the RadDatePicker date on the client?  I want to set the value to null, but how do I do that because set_selectedDate(null) throws an exception.  I want the textbox to be blank.  I tried getting the textbox and setting the value to null, but that doesn't produce the desired result too...

Thanks.

[Shinu]

Hi Brian Mains,

I guess you want to clear the selected date of RadDatePicker. You can use the clear() method for this. Check out the example below.

JavaScript:

<script type="text/javascript">
function clearRadDatePicker()
{
    var datepicker = $find("<%= RadDatePicker1.ClientID %>");
    datepicker.clear();
}
</script>

ASPX:

<telerik:RadDatePicker ID="RadDatePicker1" Runat="server">
</telerik:RadDatePicker>
<input id="Button1" type="button" value="Clear" onclick="clearRadDatePicker();" />

Thanks,
Shinu.

[Brian Mains]

Hey,

Why not allow set_selectedDate(null) instead of a clear method?  Never would have thought that as the answer.

Thanks.

[Daniel]

Hello Brian,

I recommend you examine the following link, where you can find information about the most important client-side methods of our RadDatePicker control.
RadDatePicker Client Object

Regards,
Daniel
the Telerik team

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

[Brian Mains]

Hey,

So the clear method fires the DateSelected event?  That's currently causing an error that I'm getting.  Is there a way to handle this, or simply just have to check for null?

THanks.

[Daniel]

Hello Brian,

As you properly noticed, clear fires the DateSelected event. The appropriate approach is described in the help article and it's also illustrated by the code-snipped provided by Shinu.

Kind regards,
Daniel
the Telerik team

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

[Margie]

Hi,

I tried to use the client side clear method. It is working when I entered a valid value in the date text field.



But if I enter an invalid date, the clear method does not work.



Any idea why?



I am using version 2013.2.717.40.



Thanks.

[Shinu]

Hi Margie,

You can clear the invalid date in OnError event as follows.

ASPX:

<telerik:RadDatePicker ID="RadDatePicker1" runat="server">
    <DateInput ClientEvents-OnError="OnError1">
    </DateInput>
</telerik:RadDatePicker>

JavaScript:

<script type="text/javascript">
    function OnError1(sender, args) {
        var date = $find("<%=RadDatePicker1.ClientID %>");
        date.clear();
        args.set_cancel(true)
    }
</script>

Thanks,
Shinu.

[Margie]

Hi,

Shinu, thanks for quick response. Your solution is ok, but what I really want is not automatically remove the invalid date, I wanted to click on a button first before clearing the invalid value.



I ended up using Vasil's suggestion from another post, which works perfectly. Thanks again.



------------------------------------------------------------------



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

$find("idOfYourPicker").clear();



-------------------------------------------------------------------

[Chirag]

Thanxs It was work

[JAVIER]

Please translate some paragraphs Spanish to English here, I left the solution

En el asp definan el evento cliente: OnDateSelected, abajo dejo ejemplo Asp:

<ClientEvents OnDateSelected="DateSelected"></ClientEvents>

En el codigo Asp:

<telerik:RadDateTimePicker ID="RadDateFchRemesa" runat="server" Culture="es-CO">
                                    <DateInput ID="DateInput1" runat="server"
                                                DateFormat="dd/MM/yyyy"
                                                DisplayDateFormat="dd/MM/yyyy">
                                    </DateInput>
                                    <ClientEvents OnDateSelected="DateSelected">
                                    </ClientEvents>
                                </telerik:RadDateTimePicker>

En un bloque javascript implentan el Metodo para el Evento OnDateSelected:

 <script type="text/javascript">
       //Metodo que maneja el evento cliente: OnDateSelected
        function DateSelected(sender, args) {
            args.set_cancel(true)
        }

      //Usan el metodo clear() del control donde sea necesario
      function LimpiarCamposCab() {
            var RadDateFchRemesa= $find("<%= RadDateFchRemesa.ClientID %>");
            RadDateFchRemesa.clear();
        }
</script>


I hope they will find it useful.

Javier Mejia

[JAVIER]

En esta linea me falto el ; por favor corregir

args.set_cancel(true)
//Cambiar por:
args.set_cancel(true);

Javier Mejia Reinoso