leongersen / noUiSlider

noUiSlider is a lightweight, ARIA-accessible JavaScript range slider with multi-touch and keyboard support. It is fully GPU animated: no reflows, so it is fast; even on older devices. It also fits wonderfully in responsive designs and has no dependencies.
https://refreshless.com/nouislider/
MIT License
5.67k stars 660 forks source link

noUISlider with Date --> not visible in mobile View #1238

Closed zuselli closed 11 months ago

zuselli commented 1 year ago

I'm wondering if it's possible to set min. & max. values of the slider to a specific date. As soon as I entering a specific Date e.g. 2023.01.01 the slider works fine in Web View but is not visible in mobile view. With the code from the example which only defines the year. The slider works perfect in both, Web View & Mobile view?

Could it be that this is a bug? Or how can I initialize specific dates?

This one works for Web & Mobile:

function timestamp (str) { return new Date(str).getTime(); } noUiSlider.create(slider, { range: { 'min': timestamp('2023'), 'max': timestamp('2024') }, start: timestamp('2023'), });

Whis one works only in Web View & not in Mobile View:

`function timestamp (str) { return new Date(str).getTime(); }

                  noUiSlider.create(slider, {
                    range: { 
                        'min': timestamp('2023.01.01'),
                        'max': timestamp('2023.31.01')
                    },
                    start: timestamp('2023.01.01'),
                });`

Thanks for help.

btw: it's my first github entry, and I tried to enter the code with the code symbol quotes. But the format doesn't look nice...

leongersen commented 1 year ago

Sorry, there is not enough information here for me to help. I'm not sure what you mean by "web view"/"mobile view". What does "it doesn't work" mean?

zuselli commented 1 year ago

I mean the slider is not showing up at all, when I open the Webpage on a moile phone. e.g. iPhone... (When I use more specific dates) On a desktop PC it shows the slider with the expected max / min dates...

zuselli commented 1 year ago

The following example:

https://codepen.io/zuselli/pen/ExpemLP

is working perfect in my Laptop Web Browser. But with my iPhone, the slider is not visible....

leongersen commented 1 year ago

The error in your Pen in Safari on iOS is Error: noUiSlider: 'range' value isn't numeric..

The date format 03.01.2023 you are using is non-standard, and not accepted by the new Date constructor. You can use a standardized format (2023-01-03).

github-actions[bot] commented 10 months ago

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.