RangeSelectorValueChangeMode Enum
Lists user actions that cause selected range updates.
Namespace: DevExpress.Blazor
Assembly: DevExpress.Blazor.v24.2.dll
NuGet Package: DevExpress.Blazor
Declaration
public enum RangeSelectorValueChangeMode
Members
Name | Description |
---|---|
OnHandleRelease
|
The component updates selected range values once a user drops a slider handle. |
OnHandleMove
|
The component updates selected range values whenever a user drags a slider handle. |
Related API Members
The following properties accept/return RangeSelectorValueChangeMode values:
Remarks
Use the DxRangeSelector.ValueChangeMode property to specify how the Range Selector updates the selected range.
The following code snippet sets the value change mode to OnHandleMove
, obtains values of the current range in a ValueChanged event handler, and displays the number of selected days:
<span><b>@DaysCount days are selected</b></span>
<DxRangeSelector Width="1100px"
Height="200px"
SelectedRangeStartValue="@(new DateTime(2024, 2, 1))"
SelectedRangeEndValue="@(new DateTime(2024, 2, 14))"
ValueChanged="@OnValueChanged"
ValueChangeMode="RangeSelectorValueChangeMode.OnHandleMove">
<DxRangeSelectorScale StartValue="@(new DateTime(2024, 1, 1))"
EndValue="@(new DateTime(2024, 6, 1))"
TickInterval="ChartAxisInterval.Week"
MinorTickInterval="ChartAxisInterval.Day"
MinRange="ChartAxisInterval.Week"
MaxRange="ChartAxisInterval.Month"
ValueType="ChartAxisDataType.DateTime">
<DxRangeSelectorScaleMarker>
<DxRangeSelectorScaleMarkerLabel>
<DxTextFormatSettings Type="TextFormat.MonthAndYear" />
</DxRangeSelectorScaleMarkerLabel>
</DxRangeSelectorScaleMarker>
</DxRangeSelectorScale>
<DxRangeSelectorSliderMarker>
<DxTextFormatSettings Type="TextFormat.MonthAndDay" />
</DxRangeSelectorSliderMarker>
</DxRangeSelector>
@code {
double DaysCount { get; set; } = 14;
void OnValueChanged(RangeSelectorValueChangedEventArgs args) {
var startDate = args.CurrentRange.FirstOrDefault() as DateTime?;
var endDate = args.CurrentRange.LastOrDefault() as DateTime?;
if (startDate != null && endDate != null)
DaysCount = (endDate - startDate).Value.TotalDays;
}
}