jQuery datepicker hat das ausgewählte Datum im laufenden Betrieb festgelegt


121

Wie kann ich das ausgewählte Datum der jquery-Datumsauswahl dynamisch im laufenden Betrieb ändern? Ich habe gesagt, eine Inline-Datumsauswahl erstellt. Dann möchte ich nach einiger Zeit dort ein anderes Datum wiedergeben, ohne den Datepicker von Grund auf neu zu erstellen.

Ich versuchte , die setDate Methode, aber hat nicht funktioniert, und es gibt nicht viel Dokumentation im doc .

Es ist eine andere (erweitert?) Plugin hier , aber ich möchte das Plugin verwenden , die mit jquery.ui.all.js ausgeliefert wird.

Antworten:


187

Welche Version von jQuery-UI verwenden Sie? Ich habe folgendes mit 1.6r6, 1.7 und 1.7.1 getestet und es funktioniert:

//Set DatePicker to October 3, 2008
$('#dateselector').datepicker("setDate", new Date(2008,9,03) );

16
Verwenden Sie defaultDate anstelle von setDate, wenn setDate nicht funktioniert.
Bingjie2680

8
aber für mich hat es in keiner Weise funktioniert. Das Datum wurde geändert. Das ausgewählte Datum wird jedoch nicht im Kalender angezeigt. es zeigt mich erst heute hervorgehoben.
Prageeth Godage

28

Überprüfen Sie, ob das Datum, auf das Sie es einstellen möchten, innerhalb des zulässigen Datumsbereichs liegt, wenn die Optionen minDate oder maxDate festgelegt sind.


10

Dieses Beispiel zeigt, wie der Standardwert im Dropdown-Kalender und der Wert im Textfeld verwendet werden. Außerdem wird gezeigt, wie der Standardwert auf das vorherige Datum gesetzt wird.

selectedDate ist eine weitere Variable, die das aktuell ausgewählte Datum des Kalendersteuerelements enthält

    var date = new Date();
    date.setDate(date.getDate() - 1);

    $("#datepicker").datepicker({
        dateFormat: "yy-mm-dd",
        defaultDate: date,
        onSelect: function () {
            selectedDate = $.datepicker.formatDate("yy-mm-dd", $(this).datepicker('getDate'));
        }
    });

    $("#datepicker").datepicker("setDate", date);

8

Beachten Sie, dass für DatePicker von Keith Wood ( http://keith-wood.name/datepickRef.html ) Folgendes funktioniert - beachten Sie, dass die Einstellung des Standarddatums das letzte ist:

    $('#datepicker').datepick({
        minDate: 0,
        maxDate: '+145D',
        multiSelect: 7,
        renderer: $.datepick.themeRollerRenderer,
        ***defaultDate: new Date('1 January 2008')***
    });

7

Aus irgendeinem Grund konnte ich in einigen Fällen das setDate nicht zum Laufen bringen.

Eine Problemumgehung, die ich gefunden habe, besteht darin, einfach das Wertattribut der angegebenen Eingabe zu aktualisieren. Natürlich wird der Datepicker selbst nicht aktualisiert, aber wenn Sie nur nach dem Datum suchen, funktioniert es einwandfrei.

var date = new Date(2008,9,3);
$("#your-input").val(date.getMonth()+"/"+date.getDate()+"/"+date.getFullYear());
// Will display 9/3/2008 in your #your-input input

6
Es gibt eine Pause von eins für Monate, also brauchen Sie (date.getMonth () + 1)
Adam

1
setDate funktioniert nicht, wenn es in den anfänglichen Optionen festgelegt wurde. Ich hatte es anschließend mit .datepicker ('setDate', ...)
verkettet

4
$('.date-pick').datePicker().val(new Date()).trigger('change')

endlich das, wonach ich in den letzten stunden gesucht habe! Ich muss Änderungen einleiten, nicht nur das Einrichtungsdatum im Textfeld!


2
Es sollte .datepicker()nicht sein.datePicker()
Arslan Tabassum

3

Dies ist ein alter Thread, aber ich möchte nur einige Informationen geben, wie ich verwendet habe. Wenn Sie das heutige Datum festlegen möchten, können Sie es einfach wie unten beschrieben anwenden.

 $("#datepickerid").datepicker("setDate", "0");

Wenn Sie einige Tage vor / nach dem aktuellen Datum festlegen möchten, verwenden Sie das Symbol -/+Symbol für die Anzahl der Tage, die Sie unten möchten.

 $("#datepickerid").datepicker("setDate", "-7");
 $("#datepickerid").datepicker("setDate", "+5");

2

setDate scheint nur ein Problem mit einem Inline-Datepicker zu sein, der in der jquery-Benutzeroberfläche verwendet wird. Der spezifische Fehler ist InternalError: zu viel Rekursion.


2

Das funktioniert bei mir:

$("#dateselector").datepicker("option", "defaultDate", new Date(2008,9,3));

2

In HTML können Sie Ihr Eingabefeld mit einer solchen Datumsauswahl hinzufügen

<input class="form-control date-picker fromDates" id="myDate" type="text">

und dann in Java-Skript initialisieren Sie Ihren Datepicker und setzen Sie Ihren Wert auf das Datum wie folgt:

$('.fromDates').datepicker({
                maxDate: '0',
                dateFormat: "dd/mm/yy",
                changeYear: true,
                changeMonth: true,
                yearRange: "-100:+0"
            });

var myDateVal = moment('${value}').format('DD/MM/YYYY');
$('#myDate').datepicker().datepicker('setDate', myDateVal );

(Hier zeigt das Attribut fromdate die vorherigen Daten des aktuellen Datums an.)


0
var dt = new Date();
var renewal = moment(dt).add(1,'year').format('YYYY-MM-DD');
// moment().add(number, period)
// moment().subtract(number, period)
// period : year, days, hours, months, week...

Von Nur-Code-Antworten wird bei Stack Overflow abgeraten, da sie nicht erklären, wie das Problem gelöst wird. Bitte bearbeiten Sie Ihre Antwort, um zu erklären, was der Code tut und wie er die Frage beantwortet, damit er sowohl für andere Benutzer als auch für das OP nützlich ist.
FluffyKitten vor

-1

Ich hatte auch große Probleme mit der setDate-Methode. scheint nur in v1 zu funktionieren. Was jedoch zu funktionieren scheint, ist die Verwendung der dpSetSelected-Methode:

    $("#dateselector").dpSetSelected(new Date(2010, 0, 26).asString());

Viel Glück!


-1

oder du kannst einfach haben

$('.date-pick').datePicker().val(new Date()).trigger('change')

1
Es sollte .datepicker()nicht sein .datePicker().
Florin Frătică
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.