Slider range initialization

Hi, I use Framework7 for the first time, and currently I would like to add some range sliders… But I can’t do it and I don’t know/understand my error.

So I need some help ! I just do this in my html file :

<div class="range-slider range-slider-init " data-label="true">
	<input type="range" min="0" max="100" step="10" value="50">
</div>

The range slider is visible but I don’t see the value of the range when i’m clicking and dragging on it. I tried to initialize it with DOM7 in my js file but I always have the same error " .create is not a function " so I don’t understand why it doesn’t work with range slider but, for example, I already did it with another component like calendar.

My initialization of a slider :

 var range = myApp.range.create({
	  el: '.slider-range',
	  on:{
		change:function(){
		  console.log("created");
		}
	  }
	});

and this block of code is in a pageInit(), is it a pb maybe ?

thanks in advance for your help !

Are you sure you are using v2?

I was not sure about it, i have replace my file f7 by your last version. Now I have pb with pageInit and addView functions. I’ll work to fix it and see if range sliders are working with the last version

I’m working to fix all bugs made from the new syntax of the v2, but I don’t know how can I fix this :

mainView.router.load({
		template: myApp.templates.home,
		animatePages: false,
                reload: true,
});

The error is " Cannot read property ‘home’ of undefined " but, home is defined, i made a link with the property data-page and id like this :

	  <script type="text/template7" id="home">
		<div class="page" data-page="home">
			...
		</div>
	  </script>

Is it enough ?

You can’t fix this. You need to use and configure routes instead in v2:

So I can’t use the method one page with Framework7 anymore ?

There is no such API anymore:

You need to mainView.router.navigate('/homepage/', { reloadCurrent: true, animate: false });

And in routes you need the following route:

{
  path: '/homepage/',
  template: $('script#home').text(),
}

Oh, ok. Thanks for your help