1

I am trying to use a Bootstrap slider with a custom handler. However, the value does not update when I move my slider.

HTML:

<input id="#ex6" type="range" data-slider-min="-5" data-slider-max="20" 
data-slider-step="1" data-slider-value="3"/>
<span id="ex6CurrentSliderValLabel">Current Slider Value: <span 
id="ex6SliderVal">3</span></span>

JS:

var slider = new Slider("#ex6");
 slider.on("slide", function(sliderValue) {
document.getElementById("ex6SliderVal").textContent = sliderValue;
 });

IMAGE

Azsgy
  • 3,139
  • 2
  • 29
  • 40
Fabian B.
  • 21
  • 3

1 Answers1

1

There is no need to add the # symbol to your id. The # symbol itself says you are referencing an ID.

<input id="ex6" [...] />

See also: CSS selectors: https://developer.mozilla.org/en-US/docs/Learn/CSS/Introduction_to_CSS/Selectors

Azsgy
  • 3,139
  • 2
  • 29
  • 40
  • I get this when i change it: Uncaught ReferenceError: Slider is not defined – Fabian B. Mar 25 '18 at 17:17
  • well, have you included the relevant libraries? If this solved this issue, you will probably want to accept this answer and open another question for the next issue. – Azsgy Mar 25 '18 at 19:29