seiyria / bootstrap-slider

A slider control for Bootstrap 3 & 4.
http://seiyria.github.io/bootstrap-slider/
Other
3k stars 1.14k forks source link

input value attribute is set to NaN on touch devices #903

Open flexphperia opened 5 years ago

flexphperia commented 5 years ago

When using slider on touch devices, input element value attribute is set to NaN always after sliding.

seiyria commented 5 years ago

Do you have an example in a jsfiddle?

flexphperia commented 5 years ago

Open any example and try in Chrome developer tools emulating mobile device. Drag slider and on drag end you have NaN. Library is unusable with that bug.

wt., 25 gru 2018, 15:07: Kyle J. Kemp notifications@github.com napisał(a):

Do you have an example in a jsfiddle?

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/seiyria/bootstrap-slider/issues/903#issuecomment-449853068, or mute the thread https://github.com/notifications/unsubscribe-auth/AFOBcwrVW7c4ZZXUM3sO-J8EFuKeg7dUks5u8jEPgaJpZM4ZhC48 .

kmkroski commented 5 years ago

I encountered the same issue recently: in the _getPercentage function, the touchend event is not being checked properly.

Line 1772: if (this.touchCapable && (ev.type === 'touchstart' || ev.type === 'touchmove')) {

It should be: if (this.touchCapable && (ev.type === 'touchstart' || ev.type === 'touchmove' || ev.type === 'touchend')) {

It looks as if there's a pull request regarding an issue similar/related to this, but not this exact change. There's another issue that pull request should fix though. If there's no movement on that by the time I'm back at work, I'll submit a fix.

jespirit commented 5 years ago

@kmkroski I'm in the process of refactoring the touch support code which you can find here: https://github.com/seiyria/bootstrap-slider/pull/899

I still need to do more testing and write a bunch of unit tests before those changes get merged. But feel free to submit a fix for this issue. I ran into a similiar issue when the _getPercentage() function wasn't checking for the touchend event.

You also mentioned there's another issue that should also be fixed in that pull request, what issue is that?

kmkroski commented 5 years ago

@jespirit Multiple sliders one page. It appears that if I slide one and then another, the first doesn't release and both move together.

jespirit commented 5 years ago

I had that problem too. I can't remember how I fixed it.

Try moving the sliders on this page (it should work fine): https://jespirit.github.io/bootstrap-slider/#example-3

kmkroski commented 5 years ago

I was thinking about triggering a blur on touchend (_mouseup), but only noticed it on iOS. It occurs on Android as well.