How to select a price range with jQuery (mobile)

2.7k views Asked by At

The problem I am facing right now is that I want to have a price-range selector for mobile. So I turned to jQuery Mobile to see the possibilities. But I did not find a slider with 2 handles (min/max price) but only a slider with 1 handle.

Basically, I want this, but then to work on mobile: http://jqueryui.com/demos/slider/#range

I found this for jQuery Mobile, which works perfectly, but has only 1 handle: http://jquerymobile.com/demos/1.1.0-rc.2/docs/forms/slider/

I am kinda stuck on how to continue further. How do I create a working (jQuery UI) slider with 2 handles.

I tried googling, and searching here on SO but so far no luck.

I would love to see a solution for this, or maybe an alternative (not 2 sliders).

Any help is appreciated.

1

There are 1 answers

0
Marco Johannesen On BEST ANSWER

See this previous thread: jQuery Mobile dual range slider working but buggy

It's not the best soloution - but might give you an idea, on how to proceed.

I would use the Jquery UI soloution because it's stable and reliable, and maybe theme it after your jQuery Mobile theme (give it the classes etc.).


This might be a better version: jQuery Mobile Dual Range slider

They linked to this one: http://jsfiddle.net/NkjQr/3/

And i can see that is in the roadmap for JqueryMobile: https://github.com/jquery/jquery-mobile/pull/2401