Skip to content

Add a RangeSlider Field #103

Description

@mdindoffer

Summary

Please add a Range Slider mode to the NumberField, or create a separate RangeSlider Field, that allows for selecting a range of numeric values.
Teamapps already has support for basic sliders via NumberField, but it's not really possible to compose two NumberFields to produce the desired unified range line with two control sliders.

This is useful in a couple of situations, e.g.:

  • Selecting a temporal range of years (1992 - 2007) or months (March - November)
  • Placing bounds on a numeric value (5˚C - 41˚C, 100 km - 200 km)

Currently, whenever an input like this is needed from users, it has to be collected via two separate (Number) fields.

Example

A simplistic example of this can be seen here:
image

With a live demo available at https://www.cssscript.com/demo/animated-customizable-range-slider-pure-javascript-rslider-js/

Additional requirements

A well designed range slider should handle zero-length ranges (e.g. 150 km - 150 km) intuitively, for example by overlaying one slider over another, like in the interactive example. There should also be support in place for open ended intervals (e.g. 15˚C - +∞˚C).

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions