API REFERENCE · FORM CONTROLS

`<dj-range-slider>`

A form-associated dual-thumb range. Two overlaid native ranges keep valueMin <= valueMax. Submits two form entries (<name>_min, <name>_max). value getter returns { min, max }. Composes <dj-label>. Event: change (detail {min,max}).

Try it in the playground

@dojo-ng/range-slider · v0.1.1

npm install @dojo-ng/range-slider

import "@dojo-ng/range-slider";

Properties

Property	Attribute	Type	Default
`min`	`min`	`number`	`0`
`max`	`max`	`number`	`100`
`step`	`step`	`number`	`1`
`valueMin`	`value-min`	`number`	`0`
`valueMax`	`value-max`	`number`	`100`
`name`	`name` reflected	`string`	None
`label`	`label`	`string`	None
`showOutput`	`show-output`	`boolean`	`false`
`disabled`	`disabled` reflected	`boolean`	`false`
`labelHidden`	`label-hidden`	`boolean`	`false`

Events

Event	Description
`change`	detail `{min,max}`

CSS parts

Style these with dj-range-slider::part(name).

labeltrackfilloutput

Methods

checkValidity(): booleanrestoreFormState(state: File | string | FormData | null)