Reactive bootstrap-slider

help
1

I’d like to be able to use bootstrap-slider (https://github.com/seiyria/bootstrap-slider) in one of my meteor projects that uses blaze and spacebars. An earlier forum post (Initializing bootstrap-slider as node module doesn’t work) talks about setting it up, which I’ve managed to do, but I cant see how to make the slider reactive because the input tag, which is where I would put the reactive values is overwritten but a tree of divs which ignores the reactive attributes when the slider is initialised. Has anyone got any pointers for me - perhaps this same issue is tackled in a similar project elsewhere?

2

Maybe post a demo repo? Kind of hard to understand/visualize your precise issue…

3

Yes of course: https://github.com/mattsouth/sliderex. Thanks for the prompt.

4

Try this in your onRendered:

Template.test.onRendered(function testOnRendered() {
  const self = this;
  const slider = Template.instance().$('.slider').slider();
  self.autorun(function() {
    let value = self.testvar.get();
    if (slider) {
      slider.slider('setValue', value);
    }
  });
});
5

Thanks that’s just the ticket.