InputfieldFloatRange by eelke

Simple and fast HTML5 input range slider, with optional precision, min/max and step settings. Works as a drop-in replacement for regular float and integer fields.

Float (Range) InputField

What is it?

The missing range slider Inputfield for Processwire. See also the Processwire Forum thread and the Modules directory listing.

What does it do?

This module extends InputfieldFloat and allows you to use HTML5 range sliders for number fields in your templates. It includes a visible and editable value field, to override/tweak the value if required.

Features

  • Min/max values
  • Precision (number of decimals)
  • Optional step value (Read more)
  • Optional manual override of the selected value (will still adhere to the rules above)
  • Configurable rounding of manually entered values (floor, round, ceil, disable)

Usage

  • Clone / zip repo
  • Install FieldtypeFloatRange, this automatically installs the Inputfield
  • Create new field of type Float (range) or convert an existing Float, Integer or Text field.
  • To render the field's value simply echo $page->field

Demo

A field with Min=0, Max=1, Step=0.2, Precision=2:

Field with settings Min=0, Max=200, Step=0.25, Precision=2

Todo
  • Make the display-field's size configurable (will use the Input Size field setting)
  • Hopefully become redundant

Install and use modules at your own risk. Always have a site and database backup before installing new modules.

Twitter updates

  • Today a new version of FormBuilder has been released in the FormBuilder support board (our 50th version) and it has a lot of interesting new features, which we’ll take a closer look at in this post— More
    11 June 2021
  • ProcessWire 3.0.179 adds great new admin theme customization tools that put you in full control over the Uikit admin styles— More
    28 May 2021
  • ProcessWire updates for week of 21 May 2021— More
    22 May 2021

Latest news

  • ProcessWire Weekly #370
    In the 370th issue of ProcessWire Weekly we're going to check out the latest version of the commercial FormBuilder module, introduce a couple of brand new third party modules, and more. Read on!
    Weekly.pw / 12 June 2021
  • ProcessWire FormBuilder v50 updates
    Today a new version of FormBuilder has been released in the FormBuilder support board (our 50th version) and it has a lot of interesting new features, which we'll take a closer look at in this post.
    Blog / 11 June 2021
  • Subscribe to weekly ProcessWire news

“We were really happy to build our new portfolio website on ProcessWire! We wanted something that gave us plenty of control on the back-end, without any bloat on the front end - just a nice, easy to access API for all our content that left us free to design and build however we liked.” —Castus, web design agency in Sheffield, UK