We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Dynamic resources and template

I am using the client-server version of Blazor.
I need to add Resources to the Scheduler (in Timeline view) after having downloaded them from a webserver. However, currently I cannot assign resources after creating the scheduler even if they are local and static.
I attach an example project: by clicking on the "Click here" button a method is called, which should assign the resources to the scheduler; actually, no resource is assigned, and there seems to be an exception raised. I have tried different methods, but none of them are working.
Can you please tell me if there is a way to achieve this?
Moreover, is there (or will there be) the possiblity to create a template for the resources? For instance, I need to have three columns in the resource row: the name of the person, its department and another data.

Thank you,

Attachment: SyncfusionBlazor_3f28c51d.zip

7 Replies

NR Nevitha Ravi Syncfusion Team August 2, 2019 12:21 PM UTC

Hi Riccardo, 

Greetings from Syncfusion Support. 
We have prepared a sample with our latest version 17.2.39-beta for your requirements “adding resources dynamically to scheduler” and “create a template for resources” using AddResources public method and ResourceHeaderTemplate which can be downloaded from the following link. 

Please find the following code snippet for adding the resources dynamically. 
<EjsButton OnClick="@AddResources" Content="Add Resource"></EjsButton> 
  EjsSchedule<AppointmentData> ScheduleObj; 
    public List<object> ResourceData { get; set; } = new List<object> 
         new { text= "Jack", id= 9, color= "#ea7a57", capacity= 31, type= "Conference"     } 
    public void AddResources() 
        this.ScheduleObj.AddResource(ResourceData, "Rooms", 0); 

The following code helps you to have three columns in the resource row. 
            <div class='template-wrap'> 
                <div class="room-name">@((context as dynamic).ResourceData.Text)</div> 
                <div class="room-type">@((context as dynamic).ResourceData.Capacity)</div> 
                <div class="room-capacity">@((context as dynamic).ResourceData.Type)</div> 
    public class TemplateArgs 
        public ResourceDataModel ResourceData { get; set; } 
    public class ResourceDataModel 
        public string Type { get; set; } 
        public string Text { get; set; } 
        public int Capacity { get; set; } 
    public TemplateArgs Model = new TemplateArgs(); 

The resource Jack is added dynamically on button click as in the following image. 

Please try out the sample and let us know if you need any further assistance. 


RZ Riccardo Zucchetto August 2, 2019 12:57 PM UTC

Hi Nevitha,
Thank you for your project, it exactly meets my requirements. Now I'll do a few more tests for my scenario, which is client-based (your example is Blazor server only).
Meanwhile, I would like to share with you a working example of the same requirement in the client version of Blazor: I had to add a few references and a build tag in the Client.csproj project to make it work.

Thank you again,

Attachment: SyncfusionBlazor_f7140eb4.zip

KK Karthigeyan Krishnamurthi Syncfusion Team August 5, 2019 07:27 AM UTC

Hi Riccardo, 
Thanks for sharing your project. 
We are happy that our solution fulfilled your requirements. 

UH Uwe Hein August 5, 2019 10:27 AM UTC

Hi Karthi,

  thank you for the sample you provided. There must be something wrong with the server-side sample, as I only can add 5 resources. The 6th one tries to reconnect and displays the following error:

Error: Connection disconnected with error 'Error: Server returned an error on close: Connection closed with an error.

Every additional resource produces the same error.

Ricardo's sample works fine - I can add as many resources as I want. Server and client code in index.razor are identical. 

I tried with Version="" and Version=""
I also adjusted link and script tags in _Host.chtml to:
<link rel='nofollow' href="https://cdn.syncfusion.com/ej2/17.2.40/material.css" rel="stylesheet" />
<script src="https://cdn.syncfusion.com/ej2/17.2.40/dist/ej2.min.js">script>
<script src="https://cdn.syncfusion.com/ej2/17.2.40/dist/ejs.interop.min.js">script>
Maybe you can take a closer look - to me it looks like a bug in server-side blazor.    

HB Hareesh Balasubramanian Syncfusion Team August 6, 2019 01:23 PM UTC

Hi Uwe, 

Thanks for your update. 

When we add resources to the scheduler dynamically, (for ex 5 resource will take approximately 1100ms), the execution of next step need to wait until the process complete which can be resolved by increasing the buffer size like below. Kindly add the following highlighted code in the Startup.cs file 

        public void ConfigureServices(IServiceCollection services) 
            services.AddSignalR(e => { 
                e.MaximumReceiveMessageSize = 102400000; 

We have modified our previous sample, such that we can add more number of resources dynamically. 


UH Uwe Hein August 6, 2019 04:05 PM UTC

Hi Hareesh,

  thank you for the quick reply. Is this limitation only is related to server-side blazor ? Is there a similar limit with client-side blazor ? I have to deal with 40 rooms - so it might be reasonable to set a filter on the rooms I want to check before displaying the schedule. What control would you recommend ? I am new to web programming (I come from winforms). Is there something like a checkable listbox or a checkable grid.



HB Hareesh Balasubramanian Syncfusion Team August 7, 2019 05:03 PM UTC

Hi Uwe, 

Thanks for your update. 

No, there is no limitations in the Client side sample, as Client side Balzor sample doesn’t use SignalR. 

We recommend you to try the ListBox component to add/remove resources dynamically, please find the sample demo link for the ListBox component, 

Please revert us back, if you need any further assistance on this. 


Live Chat Icon For mobile
Up arrow icon