AUI datepicker 오류 및 해결 방법

Question

합금 UI 날짜 선택 도구가 Liferay Site인지 확인하고 있습니다.

주어진 예제의 문제는 선택 옵션이 없다는 것입니다. 내 사용자의 DOB가 70 년대이면 사용자는 여러 번 뒤로 버튼을 클릭해야합니다.

이 사용자에 대한 행복 시나리오가 아닙니다. 나는 당신이 여기 AlloyUI 1.5을 사용하고, 그래서 나는 DatePickerSelect 구성 요소를 사용하는 것이 좋습니다 것이라고 믿고있어 here

Answer 1

JQuery와에 의해 주어진 년, 월 옵션 같은 내 AUI의 자바 스크립트를 수정하지만 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>