I am using a range slider in my site. The slider point/head jumps in certain point for example.In defaults it is set to number five the it can jump in number 4 or 6 etc. I want such a way that if I choose one number then I can not change it back or can not choose the other. That means I want to give only one chances to choose a number. Here is the code what I am using to show the slider. Please help me or suggest me a plugins with this functionality. thanks
var sliderAmountMap2 = [1,2,3,4,5,6,7,8,9,10];
$(function() {
$( "#slider2" ).slider({
value: 4, //array index of onload selected default value on slider, for example, 45000 in same array will be selected as default on load
min: 0, //the values will be from 0 to array length-1
max: sliderAmountMap2.length-1, //the max length, slider will snap until this point in equal width increments
});
});
Here is the HTML code
*
<div class="the_slider2">
<div id="slider2"></div>
</div>
<div class="slider2_bottom_txt">
<table >
<tbody>
<tr>
<td >1</td>
<td>2</td>
<td >3</td>
<td >4</td>
<td >5</td>
<td >6</td>
<td >7</td>
<td >8</td>
<td >9</td>
<td >10</td>
</tr>
</tbody>
</table>
</div>
*
If you want the user to disable the slider from very beginning add
$("#slider2").slider({ disabled: true});
Or else if you want the user to select it only once disable slider in change events
change: function (event, ui) {
$("#slider2").slider({
disabled: true
});