링크를 클릭하여 Datepicker를 엽니 다.

Question

내 웹 페이지에서 JQuery UI의 Datepicker를 사용하고 있습니다. 현재 저는 "mydate"라는 텍스트 필드로 작업하는 데 성공했습니다.

$('#releasedate').datepicker({ 
       changeYear: 'true', 
       changeMonth:'true', 
       startDate: '07/16/1989', 
       firstDay: 1 
      }); 

는 그러나, 나는 작은 변화를 원하는 다음과 같이 코드입니다. 텍스트 필드 대신 "날짜 선택"이라는 링크를 표시하여 datepicker를 열어야하며 날짜를 선택하면 숨겨진 텍스트 필드의 값을 업데이트해야합니다.

다른 방법으로 시도했지만 실패했습니다. JQuery 전문가, 도와 주실 수 있습니까? 나는 열심히 이것을위한 해결책을 받기를 기다리고있다. 대단히 감사드립니다.

당신은 실제로 단지 <input type="hidden" />에 날짜 선택기를 연결하고 링크를 트리거 할 수

Answer 1

그것을 열 수 :

$(function() { 
 
    $('#hiddenDate').datepicker({ 
 
     changeYear: 'true', 
 
     changeMonth: 'true', 
 
     startDate: '07/16/1989', 
 
     firstDay: 1 
 
    }); 
 
    $('#pickDate').click(function (e) { 
 
     $('#hiddenDate').datepicker("show"); 
 
     e.preventDefault(); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<link href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.0/themes/smoothness/jquery-ui.css" rel="stylesheet"/> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.0/jquery-ui.min.js"></script> 
 

 
<input id="hiddenDate" type="hidden" /> 
 
<a href="#" id="pickDate">Select Date</a>

Answer 2

이 시도 :

$('#datepicker').datepicker('hide'); 
$('a').click(function() { 
    $('#datepicker').datepicker('destroy'); 
    $('#datepicker').datepicker({ 
     altField: '#shhh', 
     changeYear: 'true', 
     changeMonth: 'true', 
     firstDay: 1, 
     onSelect: function() { 
      $('#datepicker').datepicker('destroy'); 
     } 
    }) 
}); 

jsFiddle example