Jquery UI Slider - Assigning a name to values
Question
I need to assign names to the values of a Jquery UI slider – is this possible?
Here's the code so far:
<script type="text/javascript">
$(function() {
$("#slider_style").slider({
value:2,
min: 1,
max: 3,
step: 1,
slide: function(event, ui) {
$("#style_type").val( ui.value );
}
});
$("#style_type").val( $("#slider_style").slider("value") );
});
</script>
Basically I want to make 1 appear in the #slider_style
div as the word PLAY, 2 as the word HEAL and 3 as RELAX – can anyone point out how this is achievable?
Solution
You can just use a lookup object to get the values:
var lookup = {
1: 'PLAY',
2: 'HEAL',
3: 'RELAX'
}
And then in your slide
function set the value from that object:
...
slide: function(event, ui) {
$('#style_type').val(lookup[ui.value]);
}
That will make the #style_type
get PLAY, HEAL or RELAX as value depending on the slider. Is this what you meant?
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow