Feature : RangeSelector Component #1885

New Issue

claunia · 2026-01-29T17:59:46Z

claunia commented

2026-01-29 17:59:46 +00:00

Originally created by @franklupo on GitHub (Oct 21, 2025).

Is your feature request related to a problem? Please describe.
Currently, Radzen does not include a built-in RangeSelector component.
This makes it difficult to implement interfaces where users need to select a specific range — for example, a time window or data range on a chart.
Without it, developers must use two RadzenDatePicker or RadzenSlider components, which provide a less intuitive and non-visual experience.

Describe the solution you'd like
A new RadzenRangeSelector component that allows users to select a range of numeric or datetime values using two draggable handles over an interactive visualization area.

Key features:

Support for numeric and DateTime ranges
Optional background visualization (e.g., chart or timeline)
Events triggered when the range changes (OnRangeChanged)
Integration with existing Radzen charts for dynamic zooming or filtering

The component could work similarly to the DevExpress RangeSelector:
🔗 DevExpress RangeSelector Demo

Describe alternatives you've considered

Using two RadzenDatePicker components → requires manual input, not visual
Using a double RadzenSlider → limited to numeric values, lacks graphical context

Additional context
This component would be very useful in dashboards, data analysis, and monitoring tools, where users need to interactively zoom or filter datasets over time.
It would also enhance Radzen’s data visualization capabilities and help it compete with frameworks like DevExpress and Syncfusion.

Example

RangeSelector.razor.txt
RangeSelectorScale.razor.txt
Test.razor.txt

Originally created by @franklupo on GitHub (Oct 21, 2025). **Is your feature request related to a problem? Please describe.** Currently, Radzen does not include a built-in `RangeSelector` component. This makes it difficult to implement interfaces where users need to select a specific range — for example, a **time window** or **data range** on a chart. Without it, developers must use two `RadzenDatePicker` or `RadzenSlider` components, which provide a less intuitive and non-visual experience. --- **Describe the solution you'd like** A new `RadzenRangeSelector` component that allows users to select a range of numeric or datetime values using two draggable handles over an interactive visualization area. Key features: - Support for numeric and DateTime ranges - Optional background visualization (e.g., chart or timeline) - Events triggered when the range changes (`OnRangeChanged`) - Integration with existing Radzen charts for dynamic zooming or filtering The component could work similarly to the **DevExpress RangeSelector**: 🔗 [DevExpress RangeSelector Demo](https://demos.devexpress.com/blazor/RangeSelectorOverview) --- **Describe alternatives you've considered** - Using two `RadzenDatePicker` components → requires manual input, not visual - Using a double `RadzenSlider` → limited to numeric values, lacks graphical context --- **Additional context** This component would be very useful in **dashboards**, **data analysis**, and **monitoring tools**, where users need to interactively zoom or filter datasets over time. It would also enhance Radzen’s data visualization capabilities and help it compete with frameworks like DevExpress and Syncfusion. **Example** <img width="2016" height="519" alt="Image" src="https://github.com/user-attachments/assets/9e9f03bd-ed89-4443-827c-e43a9825fdb1" /> [RangeSelector.razor.txt](https://github.com/user-attachments/files/23021964/RangeSelector.razor.txt) [RangeSelectorScale.razor.txt](https://github.com/user-attachments/files/23021966/RangeSelectorScale.razor.txt) [Test.razor.txt](https://github.com/user-attachments/files/23021965/Test.razor.txt)

claunia commented

2026-01-29 17:59:47 +00:00

@akorchev commented on GitHub (Oct 21, 2025):

Hi @franklupo,

I see that you have attached a few files with the suggested implementation. Would you consider making a pull request with the suggested changes? It would allow us to better review it and share feedback.

@akorchev commented on GitHub (Oct 21, 2025): Hi @franklupo, I see that you have attached a few files with the suggested implementation. Would you consider making a pull request with the suggested changes? It would allow us to better review it and share feedback.

claunia commented

2026-01-29 17:59:47 +00:00

@franklupo commented on GitHub (Oct 22, 2025):

Hi @akorchev ,

I'm using it like this in a project and it works pretty well. I'm busy with work and won't be able to implement it anytime soon.

Thanks

@franklupo commented on GitHub (Oct 22, 2025): Hi @akorchev , I'm using it like this in a project and it works pretty well. I'm busy with work and won't be able to implement it anytime soon. Thanks

claunia commented

2026-01-29 17:59:47 +00:00

@franklupo commented on GitHub (Nov 21, 2025):

@franklupo commented on GitHub (Nov 21, 2025): ![Image](https://github.com/user-attachments/assets/3fdefbc0-39d1-433d-b20d-109ef8516613)

Sign in to join this conversation.

Branches Tags

1 Participants

Notifications

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: starred/radzen-blazor#1885