bootstrap-slider icon indicating copy to clipboard operation
bootstrap-slider copied to clipboard

If using "ticks_positions" - slider broken

Open vadim-bulochnik opened this issue 9 years ago • 8 comments

Hello,

If using "ticks_positions" option - slider becomes broken. Please check video: https://monosnap.com/file/VsKK1OV84M3Tn3AwRWnGy7U77rOaU2

vadim-bulochnik avatar Oct 26 '15 18:10 vadim-bulochnik

Please provide a jsfiddle, not a video.

seiyria avatar Oct 26 '15 18:10 seiyria

You can check this jsfiddle: http://jsfiddle.net/h3WDq/752/ Please check second slider ("horizontal tick labels with fixed positioning not working"). This fiddle is not mine, but problem is the same.

vadim-bulochnik avatar Oct 26 '15 21:10 vadim-bulochnik

ping?

peterson4ts avatar Nov 09 '15 18:11 peterson4ts

Any update here?

elninopl avatar Nov 24 '15 17:11 elninopl

Guys, if you set values of options ticks, ticks_labels and ticks_positions in reverse order, then slider should work.

My example on jsfiddle: http://jsfiddle.net/6ecbzwgc/2/

marphi avatar Dec 01 '15 22:12 marphi

@marphi Congrats! You found a secret! :)

vadim-bulochnik avatar Dec 02 '15 08:12 vadim-bulochnik

Hello guys, i was having this issue when using slider inside a modal or inside a accordion, i dont know how to technically explain why this was happening, but i am able to fix this simply destroying the slider and recreating it, just bind this actions on modal shown event or on collapse shown event.

if you have more than one slider and are using collapse (the same conception it's applied to modal):

EG:

$('#YOUR_COLLAPSE_DIV').on('shown.bs.collapse', function (e) {
        $(e.currentTarget).find(".YOUR_CLASS_USED_IN_SLIDER").each(function () {
            $(this).slider("destroy");
            $(this).slider({
                //tooltip_position: 'bottom',
                ticks: YOURTICKS,
                ticks_labels: YOURTICKSLABELS,
                ticks_snap_bounds: YOURTICKSSNAPBOUNDS
            });
        });
    });

peterson4ts avatar Dec 03 '15 10:12 peterson4ts

Example 14 in the documentation, which gives an example of tick positions, doesn’t work as shown. The HTML versions needs to use "data-slider-ticks-positions" not "tick_positions" as shown in the example.

mckdesign avatar Apr 04 '17 05:04 mckdesign