Michael74
Michael74

Reputation: 33

Bootstrap Slider ... Min and Max ... Change Separator

It would be great if you could help me with a problem.

I'm using Bootstrap Slider (https://seiyria.com/bootstrap-slider/).

I want to display the Current Slider Value.

It works with the comma. How can I change the ',' -> ' to '

Age Range ...<br/>
<b>18</b> &nbsp; &nbsp;  <span><input id="ex2" type="text" class="span2" value="" data-slider-min="18" data-slider-max="100" data-slider-step="1" data-slider-value="[30,55]"/></span> &nbsp; &nbsp; <b>100</b><br/>
<span id="ageSliderLabel">Current Slider Value: <span id="ageSliderVal">30,55</span></span>


	<!-- Bootstrap Slider -->
	<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-slider/10.2.1/css/bootstrap-slider.css" rel="stylesheet">	
	<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-slider/10.2.1/bootstrap-slider.js"></script>		
	
	<script>
		var slider = new Slider('#ex2', {});
		slider.on("slide", function(sliderValue) {
			document.getElementById("ageSliderVal").textContent = sliderValue; 
		});		
	</script>

Upvotes: 0

Views: 696

Answers (3)

Michael74
Michael74

Reputation: 33

I have the solution.

It works after using toString()

    <script>
    var slider = new Slider('#ex2', {});
    slider.on("slide", function(sliderValue) {
        var sliderValue = sliderValue.toString();
        document.getElementById("ageSliderVal").textContent = sliderValue.replace(",", " to ")
    });     
</script>

Upvotes: 0

Michael74
Michael74

Reputation: 33

Unfortunately, it does not work for me.

I have to integrate the code with backslash in php and then nothing works anymore.

var slider = new Slider('#ex2', {}); slider.on(\"slide\", function(sliderValue) { document.getElementById(\"ageSliderVal\").textContent = sliderValue.replace(\",\", \" to \") });

Upvotes: 0

Arleigh Hix
Arleigh Hix

Reputation: 10877

document.getElementById("ageSliderVal").textContent = sliderValue.replace(",", " to ")

See https://www.w3schools.com/jsref/jsref_replace.asp

Upvotes: 2

Related Questions