AUI datepickerエラーと回避策

Question

合金UIの日付ピッカーのLiferay Siteを確認しています。

この例の問題は、選択肢がないことです。私のユーザのDOBが70の場合、ユーザは、複数回、ボタンをクリックしなければならない。

これは、ユーザにとって幸せなシナリオではありません。どのように私はjQueryのhere

Answer 1

によって与えられた年と月のオプションのようなものに私のAUIのJavaScriptを編集することができ、私はあなたがここにAlloyUI 1.5を使用していることを仮定している、と私はDatePickerSelectコンポーネントを使用したが、そのおselect要素を隠し推薦しますdisplay: none;とは必要ありません。 1年だけのドロップダウンを希望すると仮定すると、月と日の両方のドロップダウンを隠すことができます。私はここで実行可能なスニペットの例を作成しました：

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>