2012-05-24 5 views
2

드롭 다운 메뉴 {일일, 주간 및 월간}에서 작동하는 범위 슬라이더를 만들고 싶습니다.매일, 매주 및 매월 단계별로 jquery에서 범위 슬라이더를 만드는 방법

매일 단계 선택시 7로 변경되고 maxDate에 대한 minDate chages는 오늘 날짜 -7을 의미합니다. 주간 스텝 선택시 오늘 날짜가 30 일 (4 일 (7-7-7-7 = 30) 및 최소 일일 (최대 날짜))으로 변경됩니다. 월별 단계 선택시 12 시간 (12 개월 = 365 일), 오늘 날짜 (365 일)로 변경됩니다.

그리고 마우스 포인터 모두 내가 슬라이더의 매개 변수 (예를 들어 단계는 분 등 최대)는 초기화되어있어 이후의 변경을 요구하는 경우 제대로 이해하고

var maxdate1 = new Date(), 
    minDate1 = removeDays(new Date(), -7); 
alert(minDate1); 

$("#slider") 
    .slider({range: true, 
     step: 1, 
     animate:true, 
     value: maxDate1, 
     values [minDate1, maxDate1], 
     max: Math.floor((maxDate1.getTime() - minDate1.getTime())/86400000), 

     slide: function(event, ui) { 

     var date = new Date(minDate1.getTime()); 
     date.setDate(date.getDate() + ui.values[0]); 

     $('#startDate').val($.datepicker.formatDate('mm/dd/yy', date)); 
     $('#from').val($.datepicker.formatDate('M d, yy', date));   

     date = new Date(minDate1.getTime()); 

     date.setDate(date.getDate() + ui.values[1]); 

     $('#endDate').val($.datepicker.formatDate('mm/dd/yy', date)); 
     $('#to').val($.datepicker.formatDate('M d, yy', date)); 
     } 
    }); 
+0

어떤 질문이나 문제가 있습니까? 또한 가독성을 위해 코드를 들여 씁니다. – apsillers

+1

질문을 명확히 할 수 있습니까? 또한, 문제의 [jsFiddle] (http://jsfiddle.net)을 게시하면 볼 수있는 작업 사본이 있습니다. – DACrosby

답변

0

을 maxDate하는 지적 . 이 같은 것이 작동해야합니다.

$('#dropdown').change(function() { 
    switch ($(this).val()) { 
    case 'daily': 
     $('#slider').slider('option', 'step', 1); 
     break; 
    case 'weekly': 
     $('#slider').slider('option', 'step', 7); 
     break; 
    case 'monthly': 
     $('#slider').slider('option', 'step', 30); 
     break; 
    } 
}); 
관련 문제