Skip to content

Latest commit

 

History

History
79 lines (65 loc) · 3.17 KB

search-slider.component.md

File metadata and controls

79 lines (65 loc) · 3.17 KB
Title Added Status Last reviewed
Search slider component
v2.4.0
Active
2024-05-13

Search slider component

Implements a search widget consisting of a slider for numerical parameter value selection used as a search query parameter.

Slider Widget

Basic usage

{
    "search": {
        "categories": [
            {
                "id": "contentSize",
                "name": "Content Size",
                "enabled": true,
                "component": {
                    "selector": "slider",
                    "settings": {
                        "field": "cm:content.size",
                        "min": 0,
                        "max": 18,
                        "step": 1,
                        "thumbLabel": true
                    }
                }
            }
        ]
    }
}

Settings

Name Type Description
field string Field to apply the query fragment to. Required value
min number Minimum numeric value at the left end of the slider
max number Maximum numeric value at the right end of the slider
step number The step between adjacent positions on the slider
thumbLabel boolean Toggles whether the "thumb" of the slider should show the current value
allowUpdateOnChange boolean Enable/Disable the update fire event when text has been changed. By default is true.
hideDefaultAction boolean Show/hide the widget actions. By default is false.

Details

This component lets the user select from a range between two predefined numbers based on the particular field. See the Search filter component for full details of how to use widgets in a search query.

Resetting the slider value

The query fragment represented by the slider will not be added to the query until a value is selected by the user. However, once the slider has been moved, there is no way to use it to go back to the initial state (ie, the query fragment will be present regardless of the final value of the slider). This can be a problem in cases where even a zero or minimum value can affect the query.

To handle this situation, the slider comes with a Clear button to reset the value to the initial state. When the user clicks this button, the slider control is set to the min value or zero and the corresponsing query fragment is removed from the query.

See also