2014-12-30 1 views
0

datedate1의 두 가지 날짜가 있습니다. date에 나는 월과 년을 받고 있는데 date1date에서 선택한 특정 달의 요일을 얻고 싶습니다. 문제는 내가 이것을 성취 할 수 없다는 것이다. 누군가 나를 도울 수 있다면 나는 바이올린 예제를 만들었습니다.부트 스트랩 datepicker 쿼리?

아래의 댓글에서 바이올린 링크를 찾으십시오.

+0

http://jsfiddle.net/sherazakbar/f2zfcdLz/3/ – Sherry

답변

3

여기에서 datepicker에 월과 연도를 선택할 수 있습니다. datepicker1에 해당 달의 날짜 만 선택할 수 있습니다.

HTML :

<input type="text" id="datepicker" /> 
<input type="text" id="datepicker1" /> 
<button id="resetBtn" class="btn btn-danger" type="button">Clear</button> 

JQuery와 :

// Create the first datepicker based on month 
$('#datepicker').datepicker({ 
    format: 'mm-yyyy', 
    viewMode: 'months', 
    minViewMode: 'months' 
}); 

// On change, set the date of the first datepicker to the inputDate variable 
// and then set the month on the second datepicker 
$('#datepicker').on('change', function() { 
    var inputDate = $('#datepicker').datepicker('getDate'); 
    var lastDate = new Date(inputDate.getFullYear(), inputDate.getMonth() + 1, 0); 

    $('#datepicker1').datepicker({ 
     startDate: inputDate, 
     endDate: lastDate 
    }); 
}); 

// Reset the values for both datepickers 
$('#resetBtn').click(function() { 
    $('#datepicker').val("").datepicker('update'); 
    $('#datepicker1').val("").datepicker('update'); 
    $('#datepicker1').datepicker('remove'); 
}); 

경고 :
이 코드는 동적으로 datepicker1datepicker에서 선택한 날짜를 변경할 수 없습니다. 이 문제를 해결하려면 resetBtn 버튼을 사용하여 값을 지워야합니다. 사용자가 datepickers를 먼저 지우지 않고 datepicker에서 월을 변경하려고하면 오류 처리를 추가해야 할 수 있습니다. OP FROM


UPDATE :
나는 요구 사항에 따라 솔루션을 제작하고 명확한 버튼의 필요가 없다. 달은 같은 달 일이 ~ DATEPICKER2에 표시되는 날짜 선택기에서 선택되면 내 요구 사항은,

$('#datepicker').datepicker({ 
    format: 'MM', 
    viewMode: 'months', 
    minViewMode: 'months',  
}); 

$('#datepicker').on('focus', function() { 
    $('#datepicker1').val("").datepicker('update'); 
    $('#datepicker1').datepicker('remove'); 
}); 

$('#datepicker').on('change', function() { 
    var inputDate = $('#datepicker').datepicker('getDate'); 
    var lastDate = new Date(inputDate.getFullYear(), inputDate.getMonth() + 1, 0); 

    $('#datepicker1').datepicker({ 
     startDate: inputDate, 
     endDate: lastDate, 
     format: "dd", 
     viewMode: "days", 
     minViewMode: "days" 
    }); 
}); 
+0

그래 그것은 도움이되지만 사용자는 ~ DATEPICKER2 변경할 수 있습니다. – Sherry

+0

@ user2689563 답변을 업데이트했습니다. 희망이 도움이! –