2014-09-30 4 views
0

javascript를 사용하여 Metro UI CSS datepicker로 선택한 날짜를보고 싶습니다. 결국이 데이터는 AJAX 요청으로 전송할 JSON 객체를 작성하는 데 사용됩니다. 지금은 브라우저 알림 메시지에서보기 만해도 행복 할 것입니다.javascript로 MetroUI CSS Datepicker 값을 얻는 방법

다음은 날짜 피커 컨트롤입니다. http://metroui.org.ua/datepicker.html 두 번째 datepicker에는 기본값이 있습니다.

어떻게 브라우저 콘솔을 사용하여 기본값을 경고 메시지로 가져올 수 있습니까? 분명히 뭔가 빠졌지 만, 입력 요소 등의 "val()"을 확인하는 것과 같은 행운을 빕니다.

답변

2

방금 ​​해결 방법을 찾았습니다. (빠르게 그리고 더러운) : 고유 한 ID를 지정하십시오. <input type="text"...<div class="input-control text"...에 입력 한 다음 JQuery가 마법을 만들도록하십시오! 아마 당신이 http://metroui.org.ua/calendar.html 기능에서 몇 가지 유용한 힌트를 얻을 수있다, 나는 그것이 조금 더러운 알고

<div id="dpContainer" class="input-control text"> 
    <input id="inputToRead" type="text"> 
    <button class="btn-date"></button> 
</div> 

<script> 
    function getDPValue(){ 
     var selectedDate = $('#inputToRead').val(); 
     return selectedDate; 
    } 
</script> 

: 다음은 코드입니다.

더 빠르고 더 더러운 :

<script> 
    function getDPValue(){ 
    return $('#dpContainer').children('input[type=text]').val(); 
    } 
</script> 

HTH, 스테파노.

+0

이 방법은 훌륭합니다. 이전에이 캘린더 페이지의 예를 모두 눈치 채지 못했습니다. 좋은 대답! – atcrawford

1

날짜 피커에는 캘린더 컨트롤이 있습니다. 캘린더 컨트롤의 선택된 날짜를 .calendar ('getDate')로 실행할 수 있습니다. 그런 다음 JQuery가 자신의 일을 할 수있게하고 calendardatepicker 내부로 이동하십시오.

<div id="myDate" class="input-control text" data-role="datepicker" data-preset="2016-01-01"> 
    <input type="text"> 
    <button class="button"><span class="mif-calendar"></span></button> 
</div> 

<script> 
    function getMyDate(){ 
     return $('#myDate .calendar').calendar('getDate'); 
    } 
</script> 

<button class="button" onclick="alert(getMyDate())">Show My Date</button> 
+0

답변에 설명 텍스트를 추가해야합니다. – nottinhill

+0

이 코드 블록은 질문에 답할 수 있지만, 이유에 대해 약간의 설명을 해줄 수 있다면 최선일 것입니다. – Tas

관련 문제