AUI datepicker錯誤和解決方法

Question

我正在檢查合金UI日期選擇器的Liferay Site。

給出的例子中的問題是沒有選擇選項。如果我的用戶的DOB是在70年代，那麼用戶必須多次點擊後退按鈕。

這不是爲用戶快樂的情景。如何編輯我的AUI JavaScript以類似的jQuery here

Answer 1

我假設你正在使用AlloyUI 1.5在這裏，所以我會建議使用DatePickerSelect組分所給出的月和年選項，但隱藏select元素，你不需要用display: none;。假設你只想要一年下拉菜單，你可以隱藏月份和日下拉菜單。我創建了一個可運行的代碼片斷例如這裏：

AUI().use('aui-datepicker', function (A) { 
 
    var datePicker = new A.DatePickerSelect({ 
 
     dayNode: '#day', 
 
     monthNode: '#month', 
 
     yearNode: '#year', 
 
     calendar: { 
 
      dateFormat: '%m/%d/%Y' 
 
     }, 
 
     render: true 
 
    }); 
 

 
    // Working around the fact that the calendar does not get updated 
 
    // when a new year is selected: 
 
    var yearNode = A.one('#year'); 
 
    yearNode.on('change', function(event) { 
 
     datePicker.calendar.set('currentYear', yearNode.get('value')); 
 
     var date = datePicker.calendar.date; 
 
     datePicker.calendar.clear(); 
 
     datePicker.calendar.date = date; 
 
    }); 
 
});

<script src="http://cdn.alloyui.com/1.5.1/aui/aui-min.js"></script> 
 
<link href="http://cdn.alloyui.com/1.5.1/aui-skin-classic/css/aui-skin-classic-all-min.css" rel="stylesheet"> 
 

 
<div id="datePicker"> 
 
    <select id="month" style="display: none;"> 
 
     <option></option> 
 
    </select> 
 
    <select id="day" style="display: none;"> 
 
     <option></option> 
 
    </select> 
 
    <select id="year"> 
 
     <option></option> 
 
    </select> 
 
</div>