Adding Different Information for Each Resource in the Scheduler

I am trying to use the Group Edit feature in the Blazor Scheduler component so I can edit the time of the whole group at once.

<ScheduleGroup AllowGroupEdit="true" Resources="@Resources" ByDate="true"></ScheduleGroup>


Is there a way to enter different information for each group but keep the same time?

For example, you can see that all those three resources have the same information but I want to show a different location for each resource.


1 Reply

RV Ravikumar Venkatesan Syncfusion Team November 16, 2022 02:55 PM UTC

You can display one element of location from the list of locations with help of the data-group-index attribute and unique classes of the location elements as shown in the below code snippet.


[Index.razor]

@using Syncfusion.Blazor.Schedule

 

<SfSchedule TValue="AppointmentData" Width="100%" Height="650px" @bind-SelectedDate="@CurrentDate">

    <ScheduleEventSettings DataSource="@dataSource">

        <Template>

 

            @foreach (string location in (context as AppointmentData)?.Subject)

            {

                <div class="@location">@location</div>

            }

            <div>@((context as AppointmentData)?.StartTime)</div>

            <div>@((context as AppointmentData)?.EndTime)</div>

        </Template>

    </ScheduleEventSettings>

</SfSchedule>

 

@code {

    private List<AppointmentData> dataSource = new List<AppointmentData>{

    new AppointmentData

        {

            Id = 1,

            Subject = new string[] { "NewYork", "London", "Mumbai", "Chicago" },

            StartTime = new DateTime(2022, 1, 7, 15, 0, 0),

            EndTime = new DateTime(2022, 1, 7, 17, 0, 0),

            ConferenceId = new int[] { 1, 2, 3 }

        }

    };

}

 

<style>

    .NewYork, .London, .Mumbai, .Chicago {

        display: none;

    }

 

    [data-group-index="0"] .NewYork,

    [data-group-index="1"] .London,

    [data-group-index="2"] .Mumbai {

        display: block !important;

    }

</style>


Attachment: syncfusionblazorscheduleuniquelocation_95089214.zip

Loader.
Up arrow icon