Comment créer un curseur de plage dans jquery pour les étapes quotidiennes, hebdomadaires et mensuelles

Question

Je souhaite créer un curseur de plage qui fonctionne dans les menus déroulants {quotidien, hebdomadaire et mensuel}.

Lors de la sélection des étapes quotidiennes sont modifiées à 7 et minDate chages à maxDate signifie aujourd'hui date-7. Lors de la sélection des étapes hebdomadaires sont modifiés à 4 (7-7-7-7 = 30) et minDate chages à (maxDate) aujourd'hui date-30. sur la sélection des étapes mensuelles sont modifiées à 12 (12 mois = 365 jours) et minDate se transforme en (maxDate) aujourd'hui date-365.

Et à la fois le pointeur de la souris pointée MaxDate

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)); 
     } 
    }); 

Answer 1

Si je comprends bien, vous voulez être en mesure de modifier les paramètres du curseur (étape par exemple, min, max, etc.) après qu'il a été initialisé . Quelque chose comme ceci devrait fonctionner:

$('#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; 
    } 
});