seiyria / bootstrap-slider

A slider control for Bootstrap 3 & 4.
http://seiyria.github.io/bootstrap-slider/
Other
2.99k stars 1.14k forks source link

Feature Request: Allow regions of values within range to be "disabled" from being selected. #617

Open aaronrudkin opened 8 years ago

aaronrudkin commented 8 years ago

I have a project using bootstrap-slider. One of our use cases involves using a slider to drag through points in time from 1800 until the present to see political party strength at the selected point in time. The issue is that different parties come online in different periods of time (in a US context, the Whig party begins and ends during the time period we are covering).

Right now with bootstrap-slider, we have two options:

  1. Every party gets a slider for 1800-2016, we rely on external context clues on page to cue users into temporal range of activity, if user selects time period on slider where party is not active, user might get confused about data.
  2. Alternatively, every party gets a slider for its active years; users cannot select "out of bounds" values, but users might not pick up that the range of the sliders differs dramatically between pages. Some parties are only active for 5 years, while others are active for 150+.

An improvement that would both fix this and increase bootstrap-slider's flexibility would be to allow sliders to not only define a min-to-max range, but arbitrary regions of that range that are "enabled" (or "disabled"). Just as ticks take an array of values, the disabled region attribute could take an array of tuples. Sliders cannot be dragged onto disabled regions and disabled regions are styled differently from enabled regions.

I can think of a few other UI cases that would benefit from this. Imagine, for example, that a setting goes from 0-100, but users require some kind of permission override to go above a certain amount. Or suppose a setting has discontinuous options (like, the setting can be from 1-5 or from 50-100, but any values in each of those ranges). Plus my case of wanting to contain visual continuity across pages.

I'm a decent javascript programmer but don't feel entirely comfortable implementing this myself--I suspect my kludgy code would inconvenience package maintainers more than it helps. So I thought I'd open this issue, and if anyone else thought "hey, that's a useful idea" and wanted to take a swing at it, they could. Please let me know if I'm breaking etiquette by putting a feature request rather than a bug report here. Thanks in advance.

aaronrudkin commented 8 years ago

Looking through closed issues, this may be a duplicate of #595 but I can't tell for sure and unlike that user, I know it's not presently possible but am suggesting it as an improvement.

seiyria commented 8 years ago

It's a different use case than the linked issue, but this has come up before.