You can't use the "
slider-reset" class - it's already used for the reset link. However, adding this to the end of
template.js will assign the following classes to the slider items:
-
slider-unset (slider item has no value)
-
slider-set (slider item has value, either from "
Slider initial value" setting or previous visit)
-
slider-was-reset (slider was reset since page loaded) (the previous classes still apply)
Code:
$(document).ready(function() {
// Initial classes for the slider items
$('.question-item.withslider').each(function(i) {
if($('input[type="text"]', this).val() == '') {
$(this).addClass('slider-unset');
}
else {
$(this).addClass('slider-set');
}
});
// Listener on the sliders
$('.ui-slider').on('slide', function(event, ui) {
$(this).closest('.question-item').removeClass('slider-unset').addClass('slider-set');
});
// Listener on the slider reset links
$('a.slider-reset').on('click', function(event) {
$(this).closest('.question-item').addClass('slider-was-reset');
});
});