Help with jquery slider range selection

Question

Is there a way to limit the slider options in the jQuery UI slider?

I have a slider broken into 5 parts.

However, I only need options 2,3 and 4. I do not want the knob to switch to 1 or 5.

How do you limit it?

Thanks!

Answer 1

You can listen to the slide event and check its position.

When it is at 1 or 5 , you can return false and cancel the event.

It seems to work

 $( ".selector" ).slider({ min: 1, max: 5, value: 2, slide: function(event, ui) { if(ui.value == 1 || ui.value == 5) return false; } }); 

You have a game here .

Answer 2

You cannot directly change the setting to do this if you want to save 1 and 5 on the slider. If you need only 2,3 and 4, you can use:

 $( ".selector" ).slider({ min: 2, max: 4 }); 

If you want to keep 1 and 5, you will need to write an onChange function. Similar to:

 $( ".selector" ).slider({ change: function(event, ui) { this.value == 1? this.value = 2: this.value; // this.value == 5? this.value = 4: this.value; } }); 

Not sure if this is the correct syntax, you will need to check.