Frage Wie lösche / setze ich die ausgewählten Daten im jQuery UI Datepicker-Kalender zurück?


Wie setze ich die Datepicker-Kalenderwerte zurück? .. Die minimalen und maximalen Datumsbeschränkungen?

Das Problem besteht darin, dass beim Löschen der Daten (durch Löschen der Textfeldwerte) die vorherigen Datumsbeschränkungen weiterhin angewendet werden.

Ich sortiere durch die Dokumentation und nichts sprang als Lösung heraus. Ich war auch nicht in der Lage, eine schnelle Lösung für eine SO / Google-Suche zu finden

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


Lösung:

 

// 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 () ist eine private Methode des DatePicker-Objekts. Sie werden es nicht in der öffentlichen API auf der Website von jQuery UI finden, aber es funktioniert wie ein Zauber.


75
2018-02-24 17:17


Ursprung


Antworten:


Ich habe versucht, genau das zu erreichen, das heißt, den Datepicker zu leeren, damit vom Benutzer eingegebene Filter entfernt werden können. Etwas googelnd fand ich dieses süße Stück Code:

Sie können die Löschfunktion auch für schreibgeschützte Felder hinzufügen. Füge einfach den folgenden Code zu deinem Datepicker hinzu:

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

Personen können markieren (sogar Read Only-Felder) und verwenden Sie dann die Rücktaste oder die Löschtaste, um das Datum mit zu entfernen _clearDate Funktion.

Quelle


74
2017-09-29 04:37



Hast du versucht:

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

Das sollte nach dem funktionieren API-Dokumentation


49
2017-12-07 11:29



Sie müssen die Optionen nur noch auf null setzen:

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

Ich habe dein Spiel geändert: http://jsfiddle.net/tF5MH/9/


21
2018-02-24 17:43



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

11
2018-05-27 05:39



Versuchen Sie, den Verrechnungscode zu ändern:

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

10
2018-02-24 17:23



Versuche dies, Dies fügt Clear-Schaltfläche auf Jquery-Kalender hinzu, der das Datum löscht.

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

7
2017-09-17 07:13



Setzen Sie die maximalen Datumsattribute auf Ihrem Datepicker zurück, wenn Sie auf "Löschen" klicken.

Von jquery Website

Get or set the maxDate option, after init.

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

3
2018-02-24 17:24



Die offensichtliche Antwort war diejenige, die für mich funktionierte.

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

Wobei $ ('# datepicker') die ID des Eingabeelements ist.


2
2017-09-02 23:53