How do I clear/reset the selected dates on the jQuery UI Datepicker calendar?

I was trying to accomplish this very thing, that is, empty the datepicker so that filters entered by the user could be removed. Googling a bit I found this sweet piece of code:

You can add the clear feature even on read only fields. Just add the following code to your datepicker:

}).keyup(function(e) {
    if(e.keyCode == 8 || e.keyCode == 46) {
        $.datepicker._clearDate(this);
    }
});

People will be able to highlight (even Read Only fields) and then use backspace or delete key to remove the date using _clearDate function.

Source


Did you try:

$('selector').datepicker('setDate', null);

That should work according to the API documentation


you just need to set the options again to null:

dates.datepicker( "option" , {
    minDate: null,
    maxDate: null} );

I've changed your jsfiddle: http://jsfiddle.net/tF5MH/9/


$('.date').datepicker('setDate', null);

Try changing the clearing code to:

$('#clearDates').on('click', function(){
    dates.attr('value', '');
    $("input[id$='dpFrom'], input[id$='dpTo']").datepicker( "option", "maxDate", null );
    $("input[id$='dpFrom'], input[id$='dpTo']").datepicker( "option", "minDate", null );
});