| Table of Contents |
|---|
Overview
The Numeric Range Slider Facet component renders a Range Slider Component and number input elements for minimum and maximum value.
...
| Code Block | ||
|---|---|---|
| ||
{
idstartValue: stringnumber;
fieldendValue: string | undefinednumber;
minValue: number;
maxValue: number;
} |
...
Attribute Name | Attribute Value |
|---|---|
hawksearch-minstart | |
hawksearch-maxend |
These attributes should be placed on a number input elements. When these elements lose focus (blurred), the entered price range will be applied as a facet value.
Default Template
| Code Block | ||||
|---|---|---|---|---|
| ||||
<div class="numeric-range-facet">
<div class="row">
<div class="column column--6">
<input type="number" hawksearch-minstart value="{{startValue}}" min="{{minValue}}" max="{{endValue}}" aria-label="Minimum" />
</div>
<div class="column column--6">
<input type="number" hawksearch-maxend value="{{endValue}}" min="{{startValue}}" max="{{maxValue}}" aria-label="Maximum" />
</div>
</div>
</div> |
...