# Controlled Mode

By default, the RangeSlider is in an uncontrolled state.

To manage the state of the RangeSlider:

1. Use its [`value`](https://www.telerik.com/kendo-react-ui/components/inputs/api/rangesliderprops#value) property.
2. Handle the [`onChange`](https://www.telerik.com/kendo-react-ui/components/inputs/api/rangesliderprops#onchange) event.
3. Pass the new value through the props.

[Demo Source](https://demos.telerik.com/kendo-react-ui/inputs/rangeslider/controlled/func/source.txt)

## Suggested Links

* [API Reference of the RangeSlider](https://www.telerik.com/kendo-react-ui/components/inputs/api/rangeslider)