Datepicker-set-default-Datum

Ich versuche, legen Sie Standard-Datum für Jquery datepicker auf init. Hier ist mein html:

var content = "";
            content = "<table class=\"filter-table\">";
            content += "<tr><td><label for='startDate'>From </label></td><td><input name='startDate' id='startDate' class='date-picker' /></td></tr>";
            content += "<tr><td>&nbsp;</td></tr>";  
            content += "<tr><td><label for='endDate'>To </label></td><td><input name='endDate' id='endDate' class='date-picker'  /></td></tr>";

Und meine JavaScript:

<script type="text/javascript">
    function showdatepicker() {
        $('.date-picker').datepicker( {
            changeMonth: true,
            changeYear: true,
            changeDay: true,
            showButtonPanel: true,
            dateFormat: 'yy-mm-dd',
            onClose: function(dateText, inst) { 
                var day = $("#ui-datepicker-div .ui-datepicker-day :selected").val();
                var month = $("#ui-datepicker-div .ui-datepicker-month :selected").val();
                var year = $("#ui-datepicker-div .ui-datepicker-year :selected").val();
                    $('#startDate').datepicker({defaultDate: -30});
                $('#endDate').datepicker({defaultDate: new Date()});
            }
        });
    }       
    </script>

Was ich versuche zu tun ist, stellen Sie das Datum und zeigen Sie in das Textfeld, wenn Sie auf die Seite geladen werden. Die endDate sollte aktuelle Datum, während start Datum sollte einen Monat vor. Jedoch, durch die Verwendung dieser codes, es zeigt nicht das Datum in die textbox beim ersten laden.

Frage ich mich, warum es so ist. Vielen Dank im Voraus.

InformationsquelleAutor | 2014-04-15
  1. 6

    Ich, wie Sie, könne nicht mit einer Methode, die auf der datepicker zum füllen einer Standard-Datum in das input.

    So anstelle, habe ich gemacht, code mit vanilla JS berechnen Sie die Standard-Daten, und formatieren Sie Sie für die Anzeige in den Textboxen.

    Hier ist die JS fügte ich hinzu:

    function showdatepicker() {
    //same as yours
}

function populateDefaultValues() {
    var today = new Date();
    var month = today.getMonth() - 1,
        year = today.getFullYear();
    if (month < 0) {
        month = 11;
        year -= 1;
    }
    var oneMonthAgo = new Date(year, month, today.getDate());

    $('#startDate').val($.datepicker.formatDate('yy-mm-dd', today));
    $('#endDate').val($.datepicker.formatDate('yy-mm-dd', oneMonthAgo));
}

$(function() {
    populateDefaultValues();
    showdatepicker();
});

    jsFiddle

    • Es funktioniert, vielen Dank. Also im Grunde habe ich zwei unterschiedliche Funktionen für zwei verschiedene Zwecke?
    • Gut, Sie konnte umgestalten, um zu halten Dinge TROCKEN. Und Sie finden es vielleicht nützlich, um eine bessere Bibliothek für die Verwaltung von Daten wie MomentJS, die es einfacher machen, bauen Sie einen Termin, wenn man alles berücksichtigt wie Schaltjahre, Tage im Monat, usw. Meine Methode hat nicht ganz tun, dass ich jetzt merke.
    • Wenn Sie nur ausgeführt, dass der code einmal auf die Seite laden, legte es in die $(function(){ block statt.
    • Guter Punkt, das würde verhindern das verschmutzen der globalen Namensraum unnötig.
    • Vielen Dank für die Erwähnung MomentJS. Sieht super praktisch!
    InformationsquelleAutor GregL
  2. 0

    Haben Sie einen Blick auf die defaultDate option. Es bietet genau die Funktionen, die Sie brauchen.

    Weil das Standard-Datum-Optionen variieren, wird für jede datepicker Sie benötigen, initialisieren Sie Sie separat (im wesentlichen copy-paste und zwicken, um zu passen).

    http://api.jqueryui.com/datepicker/#option-defaultDate

    • Aber ich dachte, das war gemeint für die Einstellung des Datums am Kalender, aber nicht das Textfeld selbst?
    • Sorry, das ist richtig. @GregL s Antwort ist die beste in dieser Instanz.
    • Trotzdem, danke für den link! 🙂
    InformationsquelleAutor Wireblue
Schreibe einen Kommentar