DxScheduler.DateNavigatorTextTemplate Property

Specifies the template used to display text in the Scheduler’s Date Navigator.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v24.1.dll

NuGet Package: DevExpress.Blazor

Declaration

[Parameter]
public RenderFragment<SchedulerViewInfo> DateNavigatorTextTemplate { get; set; }

Property Value

Type	Description
RenderFragment<SchedulerViewInfo>	The template content.

Remarks

The Scheduler’s Date Navigator displays a date or date range that corresponds to the current Scheduler view. These dates have a standard .NET format.

You can use the DateNavigatorTextTemplate to customize the text displayed in the Date Navigator. The following code hides the month/year part for the start date if both start and end dates have the same month/year.

Razor

@using MyProject.Services

<DxScheduler DataStorage="@DataStorage">
    <Views>
        <DxSchedulerWeekView ShowWorkTimeOnly="true" />
        <DxSchedulerWorkWeekView ShowWorkTimeOnly="true" />
        <DxSchedulerMonthView />
    </Views>
    <DateNavigatorTextTemplate><span>@CalculateDateString(context)</span></DateNavigatorTextTemplate>
</DxScheduler>

@code {
    DxSchedulerDataStorage DataStorage = new DxSchedulerDataStorage() {
            AppointmentsSource = AppointmentCollection.GetAppointments(),
            AppointmentMappings = new DxSchedulerAppointmentMappings() {
                Type = "AppointmentType",
                Start = "StartDate",
                End = "EndDate",
                Subject = "Caption",
                AllDay = "AllDay",
                LabelId = "Label",
                StatusId = "Status",
                RecurrenceInfo = "Recurrence"
            }
        };

    string CalculateDateString(SchedulerViewInfo viewInfo) {
        if (viewInfo.ActiveViewType == SchedulerViewType.Month) {
            return viewInfo.VisibleTimeRange.Start.ToString("MMM yyyy");
        }
        else {
            if (viewInfo.VisibleTimeRange.End - viewInfo.VisibleTimeRange.Start < TimeSpan.FromDays(1)) {
                return viewInfo.VisibleTimeRange.Start.ToString("dd MMM yyyy");
            }
            else {
                if (viewInfo.VisibleTimeRange.Start.Year != viewInfo.VisibleTimeRange.End.Year)
                    return viewInfo.VisibleTimeRange.Start.ToString("dd MMM yyyy") + " - " + viewInfo.VisibleTimeRange.End.ToString("dd MMM yyyy");
                else {
                    if (viewInfo.VisibleTimeRange.Start.Month != viewInfo.VisibleTimeRange.End.Month)
                        return viewInfo.VisibleTimeRange.Start.ToString("dd MMM") + " - " + viewInfo.VisibleTimeRange.End.ToString("dd MMM yyyy");
                    else
                        return viewInfo.VisibleTimeRange.Start.ToString("dd") + " - " + viewInfo.VisibleTimeRange.End.ToString("dd MMM yyyy");
                }
            }
        }
    }
}

Appointment

public class Appointment {
    public Appointment() {}

    public DateTime StartDate { get; set; }
    public DateTime EndDate { get; set; }
    public string Caption { get; set; }
    public int Label { get; set; }
    public int Status { get; set; }
    public bool AllDay { get; set; }
}

AppointmentCollection

using System.Globalization;

public static partial class AppointmentCollection {
    public static List<Appointment> GetAppointments() {
        DateTime date = DateTime.Today;
        var dataSource = new List<Appointment>() {
            new Appointment {
                Caption = "Upgrade Personal Computers",
                StartDate = date + (new TimeSpan(0,  14, 0, 0)),
                EndDate = date + (new TimeSpan(0, 16, 30, 0)),
                Label = 1,
                Status = 1
            },
            new Appointment {
                Caption = "Install New Router in Dev Room",
                StartDate = date + (new TimeSpan(2, 11, 30, 0)),
                EndDate = date + (new TimeSpan(2, 13, 30, 0)),
                Label = 6,
                Status = 1
            },
            new Appointment {
                Caption = "New Brochures",
                StartDate = date + (new TimeSpan(2, 15, 00, 0)),
                EndDate = date + (new TimeSpan(2, 16, 45, 0)),
                Label = 8,
                Status = 1
            },
            new Appointment {
                Caption = "Approve Personal Computer Upgrade Plan",
                StartDate = date + (new TimeSpan(3, 13, 30, 0)),
                EndDate = date + (new TimeSpan(3, 16, 0, 0)),
                Label = 1,
                Status = 1
            },
            new Appointment {
                Caption = "Customer Workshop",
                StartDate = date + (new TimeSpan(4,  11, 0, 0)),
                EndDate = date + (new TimeSpan(4, 12, 0, 0)),
                AllDay = true,
                Label = 8,
                Status = 1
            },
            new Appointment {
                Caption = "Upgrade Server Hardware",
                StartDate = date + (new TimeSpan(6, 11, 0, 0)),
                EndDate = date + (new TimeSpan(6, 13, 30, 0)),
                Label = 6,
                Status = 1
            }
        };
        return dataSource;
    }

    private static string ToString(DateTime dateTime) {
        return dateTime.ToString(CultureInfo.InvariantCulture);
    }
}