Back to Devexpress

DxRangeSelectorScale.WorkDates Property

blazor-devexpress-dot-blazor-dot-dxrangeselectorscale-cba5b209.md

latest2.9 KB
Original Source

DxRangeSelectorScale.WorkDates Property

Specifies dates that DxRangeSelector treats as workdays.

Namespace : DevExpress.Blazor

Assembly : DevExpress.Blazor.v25.2.dll

NuGet Package : DevExpress.Blazor

Declaration

csharp
[Parameter]
public object[] WorkDates { get; set; }

Property Value

TypeDescription
Object[]

An array of DateTime objects.

|

Remarks

Enable the WorkdaysOnly option to display workdays only on the scale. Use the WorkDates property to mark select weekend dates as workdays and add them to the value list.

The following code snippet marks specific weekend dates as workdays and work week dates as holidays and uses the checkbox to display only workdays on the scale:

razor
<DxCheckBox @bind-Checked="showWorkDays" T="bool">Show Workdays Only</DxCheckBox>
<DxRangeSelector Width="1100px"
                 Height="200px"
                 SelectedRangeStartValue="@(new DateTime(2024, 2, 1))"
                 SelectedRangeEndValue="@(new DateTime(2024, 2, 14))">
    <DxRangeSelectorScale StartValue="@(new DateTime(2024, 1, 1))"
                          EndValue="@(new DateTime(2024, 3, 1))"
                          TickInterval="ChartAxisInterval.Day"
                          MinRange="ChartAxisInterval.Week"
                          MaxRange="ChartAxisInterval.Month"
                          WorkdaysOnly="showWorkDays"
                          WorkDates="@(new object[]{new DateTime(2024, 2, 3),
                                                    new DateTime(2024, 2, 10)})"
                          Holidays="@(new object[]{new DateTime(2024, 1, 4),
                                                   new DateTime(2024, 1, 5),
                                                   new DateTime(2024, 1, 12)})"
                          ValueType="ChartAxisDataType.DateTime">
        <DxRangeSelectorScaleMarker>
            <DxRangeSelectorScaleMarkerLabel>
                <DxTextFormatSettings Type="TextFormat.MonthAndYear" />
            </DxRangeSelectorScaleMarkerLabel>
        </DxRangeSelectorScaleMarker>
    </DxRangeSelectorScale>
    <DxRangeSelectorSliderMarker>
        <DxTextFormatSettings Type="TextFormat.MonthAndDay" />
    </DxRangeSelectorSliderMarker>
</DxRangeSelector>

@code {
    bool showWorkDays = false;
}

See Also

DxRangeSelectorScale Class

DxRangeSelectorScale Members

DevExpress.Blazor Namespace