Date Range Slider

Side panels and detached filter controls work. They also break the visual flow of a dashboard and add friction for every user who needs to change a date range.

The Date Range Slider is a BloX-based widget that embeds an interactive date filter directly on the dashboard canvas. Users drag to set a start and end date, then click Apply Filter to update the full dashboard. It supports five time resolutions (Day, Week, Month, Quarter, and Year) and is styled via HTML and CSS, so it matches your layout rather than sitting outside it.

Key Features

• Five time resolutions: Choose from Day, Week, Month, Quarter, or Year. Set the resolution that matches the granularity your users actually need.
• Canvas-embedded filtering: The slider lives inside the dashboard widget area, not in a side panel. Users interact with it in context, without disrupting the layout.
• BloX-powered styling: Colors, button labels, and layout are customizable through HTML and CSS in the BloX Configurations tab. No changes outside the widget are required.
• Apply Filter action: Selecting a range doesn’t update the dashboard automatically. Users confirm with the Apply Filter button, which triggers a custom BloX action and updates all connected widgets.
• Persistent selection via widget-level script: A required widget-level script retains the selected date range when users navigate or interact with other filters. Without it, selections reset.

Ready to see Date Range Slider in action? Explore our live dashboard!