Search date range component

Implements a search widget for the Search Filter component.

Basic usage

{
    "search": {
        "categories": [
            {
                "id": "createdDateRange",
                "name": "Created Date (range)",
                "enabled": true,
                "component": {
                    "selector": "date-range",
                    "settings": {
                        "field": "cm:created"
                    }
                }
            }
        ]
    }
}

Settings

Details

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

Custom date format

You can set the date range picker to work with any date format your app requires. You can use any date format supported by Moment.js in the dateFormat and in the maxDate setting:

{
    "search": {
        "categories": [
            {
                "id": "createdDateRange",
                "name": "Created Date (range)",
                "enabled": true,
                "component": {
                    "selector": "date-range",
                    "settings": {
                        "field": "cm:created",
                        "dateFormat": "DD-MMM-YY",
                        "maxDate": "02-Mar-20"
                    }
                }
            }
        ]
    }
}

See also

• Search Configuration Guide
• Search filter chips component
• Search filter component
• Search check list component
• Search number range component
• Search radio component
• Search slider component
• Search text component