¿Cómo restablezco los valores del calendario del selector de fechas? ... ¿Las restricciones de fecha mínima y máxima?

El problema es que cuando borro las fechas (eliminando los valores del cuadro de texto), las restricciones de fechas anteriores aún se aplican.

He estado revisando la documentación y nada saltó como solución. Tampoco pude encontrar una solución rápida en una búsqueda de SO / Google

http://jsfiddle.net/CoryDanielson/tF5MH/

Solución:

// from & to input textboxes with datepicker enabled
var dates = $("input[id$='dpFrom'], input[id$='dpTo']");

// #clearDates is a button to clear the datepickers
$('#clearDates').on('click', function(){
    dates.attr('value', '');
    dates.each(function(){
        $.datepicker._clearDate(this);
    });
});​​

_.clearDate () es un método privado del objeto DatePicker. No lo encontrará en la API pública en el sitio web de jQuery UI, pero funciona de maravilla.

Estaba tratando de lograr esto mismo, es decir, vaciar el selector de fechas para que los filtros ingresados ​​por el usuario pudieran eliminarse. Buscando un poco en Google, encontré este dulce código:

Puede agregar la función de borrar incluso en campos de solo lectura. Simplemente agregue el siguiente código a su selector de fechas:

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

Las personas podrán resaltar (incluso campos de solo lectura) y luego usar la tecla de retroceso o eliminar para eliminar la fecha usando la _clearDatefunción.

Fuente

Has probado:

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

Eso debería funcionar de acuerdo con la documentación de la API

solo necesita establecer las opciones nuevamente en nulo:

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

He cambiado su jsfiddle: http://jsfiddle.net/tF5MH/9/

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

Intente cambiar el código de compensación a:

$('#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 );
});

Pruebe esto, esto agregará un botón de borrar en el calendario de Jquery que borrará la fecha.

$("#DateField").datepicker({
    showButtonPanel: true,
    closeText: 'Clear',
         onClose: function (dateText, inst) {
        if ($(window.event.srcElement).hasClass('ui-datepicker-close'))
        {
            document.getElementById(this.id).value = '';
        }
    }
});

Restablezca los atributos de fecha máxima en su selector de fechas cuando haga clic en borrar.

Desde el sitio web de jquery

Get or set the maxDate option, after init.

    //getter
    var maxDate = $( ".selector" ).datepicker( "option", "maxDate" );
    //setter
    $( ".selector" ).datepicker( "option", "maxDate", '+1m +1w' );

Sé que es un poco tarde, pero aquí hay un código simple que lo hizo por mí:

$('#datepicker-input').val('').datepicker("refresh");

La respuesta obvia fue la que funcionó para mí.

$('#datepicker').val('');

donde $ ('# datepicker') es el id del elemento de entrada.

Una versión modificada de la solución de Leniel Macaferi para tener en cuenta que la tecla de retroceso es un atajo de "retroceso de página" en IE8 cuando un campo de texto no tiene el foco (que parece ser el caso cuando el selector de fechas está abierto).

También se usa val()para despejar el campo ya _clearDate(this)que no funcionó para mí.

$("#clearDates").datepicker().keyup(function (e) {
    // allow delete key (46) to clear the field
    if (e.keyCode == 46)
        $(this).val("");

    // backspace key (8) causes 'page back' in IE8 when text field
    // does not have focus, Bad IE!!
    if (e.keyCode == 8)
        e.stopPropagation();
});

La inicialización de mi selector de fechas se ve así:

    dateOptions = {
                changeYear: true,
                changeMonth: true,
                dateFormat: 'dd/mm/yy',
                showButtonPanel: true,
                closeText: 'Clear',
            };

Por lo tanto, el botón "Listo" predeterminado tendrá texto "Borrar" .

Ahora, dentro de datepicker.js encuentra la función interna '_attachHandlers' Se ve así:

 _attachHandlers: function (inst) {
            var stepMonths = this._get(inst, "stepMonths"),
                id = "#" + inst.id.replace(/\\\\/g, "\\");
            inst.dpDiv.find("[data-handler]").map(function () {
                var handler = {
                    prev: function () {...},
                    next: function () {...},
                    hide: function () {
                        $.datepicker._hideDatepicker();
                    },
                    today: function () {...}
                    ... 

Y cambie la función de ocultar para que se vea así:

                   ...
                   hide: function () {
                        $.datepicker._clearDate(id);
                        $.datepicker._hideDatepicker();
                    },
                    ...

Utilizo este código para limpiar el campo y todas las travesuras. Necesitaba un campo vacío para mi caso de uso

jQuery.datepicker._clearDate(window.firstDay);
window.firstDay.datepicker('setDate',null);
window.firstDay[0].value = '';

Por alguna razón .val('')no funcionaría para mí. Pero eludir jQuery lo hizo. En mi opinión, es un error que no haya una opción .datepicker ('borrar').

Mi forma de resolver este problema

Cambiar var 'controles' en ui.js

controls = (!inst.inline ? "<button type='button' class='ui-datepicker-close ui-state-default ui-priority-primary ui-corner-all' data-handler='hide' data-event='click'>" +
        this._get(inst, "closeText") + "</button>" + "<button type='button' class='ui-datepicker-close ui-datepicker-clear ui-state-default ui-priority-primary ui-corner-all' data-handler='hide' data-event='click'>" +
        this._get(inst, "clearText") + "</button>" : "");

Luego agregue una var clearText

    this.regional[""] = { // Default regional settings
    closeText: "Done", // Display text for close link
    clearText: "Clear", // Display text for close link
    prevText: "Prev", // Display text for previous month link

Y antes de mostrar la función

$(".i_date").datepicker
(
    {
        beforeShow: function (input, inst)
        {
            setTimeout
            (
                function () 
                { 
                    $('.ui-datepicker-clear').bind('click', function() { $(input).val(''); });
                }, 
                0
            );
        }
    }
);

$("#datepicker").datepicker({            
        showButtonPanel: true,
        closeText: 'Clear', 
        onClose: function () {
            var event = arguments.callee.caller.caller.arguments[0];                
            if ($(event.delegateTarget).hasClass('ui-datepicker-close')) {
                $(this).val('');
            }
        }
    });

En Firefox funciona para mí en forma (mediante programación), donde el control de selector de fecha está deshabilitado de forma predeterminada:

$("#txtDat2").prop('disabled', false); //temporary enable controls<br>
$("#txtDat2").val("YYYY-MM-DD"); //reset date to dd.mm.yyyyy
$("#txtDat2").prop('disabled', true); //back to default state

Pruebe esta solución, funcionará correctamente como lo he intentado

$('selector').datepicker('setStartDate', 0);

 $('selector').datepicker('setEndDate', 0);
$('selector').datepicker('update');