jQuery datepicker를 별도의 일/월/년 필드로 나눕니다.

Question

Wordpress 용 연락처 양식 7 플러그인을 사용하고 있는데, jQuery datepicker를 사용하여 날짜 필드를 생성한다고 생각합니다.

내 질문은 사용자의 입력 상자를 세 개의 개별 요소 (일/월/년)로 나눌 수 있지만 여전히 날짜 피커를 사용하여 사용자의 입력 여부를 확인합니다 예를 들어 2 월 31 일 선택에서)? 희망 무슨 뜻인지 설명

기본 JSFiddle ... http://jsfiddle.net/lustre/n908n2g3/1/

내가 코드 D 포함 들었다 원인 기본 날짜 선택기 코드 ': 그냥 어떤 조언/도움을 찾고

$("#datepicker").datepicker(); 

를 :) 심지어 이런 것이 가능한가? 세 개의 드롭 다운 필드로 수동으로 분할해야한다면 새 JavaScript를 적용해야합니까?

Answer 1

나를 위해 작동합니다.

$("#datepicker").datepicker({ 
    onSelect: function(date) { 

      date = date.split(/\//g); 

      var day = date[1]; 
      var month = date[0]; 
      var year = date[2]; 

      $('#day').val(day); 
      $('#month').val(month); 
      $('#year').val(year); 

     } 
}); 

이 또한 내가 읽기 전용 3 개의 입력 필드를 만들 것 : 즉시 날짜를 선택 호출되는 날짜 선택기를위한 이벤트 핸들러 (onSelect를가) 있습니다. 따라서 사용자는 datepicker에 의해 삽입 된 값을 수정할 수 없습니다.

<p><input id="day" type="text" placeholder="Day" readonly/> 
<input id="month" type="text" placeholder="Month" readonly/> 
<input id="year" type="text" placeholder="Year" readonly/></p> 

또 다른 방법은 각 요소에 날짜 선택기를 추가하는 것입니다 :

attachDatepickerToFieldById("#day"); 
attachDatepickerToFieldById("#month"); 
attachDatepickerToFieldById("#year"); 

function attachDatepickerToFieldById(id){ 

    $(id).datepicker({ 
     onSelect: function(date) { 

      date = date.split(/\//g); 

      var day = date[1]; 
      var month = date[0]; 
      var year = date[2]; 

      $('#day').val(day); 
      $('#month').val(month); 
      $('#year').val(year); 

     } 
    }); 

} 

는 필드를 클릭하면 이제 날짜 선택기가 나타납니다 및 선택 날짜 이후에 세 개의 필드가 따라 설정됩니다. 이 경우 원래 입력 필드를 제거 할 수 있습니다.