2016-12-06 3 views
0

Ich versuche, Datepicker von http://foundation-datepicker.peterbeno.com/example.html zu verwenden, um den Benutzer zu einem Datum auszuwählen.Jquery Datepicker - Jahr dann Monat dann Tag

Der Datepicker hat ein wirklich schönes Jahr-Picker und Monat-Picker-Format anstelle der Pfeile, es hat eine schöne Auswahl.

year-picker

die einzige Möglichkeit, das Jahr Picker zuzugreifen ich sagen kann, ist auf das Jahr an der Spitze klicken, jedoch möchte ich dies zuerst auf Standard zeigen. sobald der Benutzer das Jahr auswählt, dann lassen Ihnen den Monat mit dem Monat Kommissionierer

[Monat Picker] [2] zur Auswahl - 2: i.stack.imgur.com/CiIgU.png (i nicht in der Lage sind zu posten Sie mehr als 2 Links, da ich neu zu stackoverflow bin, aber hier ist der beabsichtigte Screenshot - wie unten ...)

Ich möchte, dass sie zuerst das Jahr, dann den Monat, dann den Tag auswählen. Aber alle Beispiele, die ich sehe, sehe ich nicht, wie man alle drei mit Jahr beginnt.

dann Picker schließlich der Standard Tag

[Tag-Picker] [3] - 3:

Alternativ i.stack.imgur.com/p3re2.png wenn die oben nicht möglich ist, die ermöglichen könnte, Benutzer, um 3 separate Zeiten mit 3 verschiedenen Datumsauswahlern auszuwählen - eine für Jahr, Monat und Tag. Ich kann den Monat Kommissionierer nur bekommen die Arbeit mit dem folgenden (aber nicht das Jahr Kommissionierer):

<div class="row collapse date" id="dpMonths" data-date-format="mm/yyyy" data-start-view="year" data-min-view="year" style="max-width:200px;"> 
<div class="small-2 columns"> 
    <span class="prefix"><i class="fa fa-calendar"></i></span> 
</div> 
<div class="small-10 columns"> 
    <input size="16" type="text" value="02/2012" readonly> 
</div> 

<script> 
$(function(){ 
    $('#dpMonths').fdatepicker(); 
}); 
</script> 

Ist das möglich?

Es gibt jede Menge Beispiele auf dieser Seite, aber wenn ich ändern versuchen, einen von ihnen es entweder bricht oder tut das tun, was ich tun muss ...

Mit freundlichen Grüßen, Dave

Antwort

0

Die Beispiele auf der obigen Website sind nicht korrekt. Ich habe es geschafft, die Antwort in einem der Commits nach viel Suchen zu finden. Hoffentlich hilft diese Antwort jemand anderem.

$('.monthpicker').fdatepicker({ 
format : 'mm/yyyy', 
    startView : 1, 
    minView : 1 
}); 

Die Ansichten werden nach oben nummeriert, so 4 = Jahr usw.

So wählen Datum durch Jahr gehen -> Monat -> Tag:

$('.monthpicker').fdatepicker({ 
    format : 'mm/yyyy', 
     startView : 4, 
     minView : 2 
    }); 
Verwandte Themen