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. (Last updated on: June 24, 2019).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Dynamic resources and template

Thread ID:

Created:

Updated:

Platform:

Replies:

146364 Aug 1,2019 12:25 PM UTC Aug 7,2019 05:03 PM UTC Blazor 7
loading
Tags: Scheduler
Riccardo Zucchetto
Asked On August 1, 2019 02:20 PM UTC

Hi,
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,
Riccardo

Attachment: SyncfusionBlazor_3f28c51d.zip

Nevitha Ravi [Syncfusion]
Replied On 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. 
<ScheduleTemplates> 
        <ResourceHeaderTemplate> 
            <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> 
            </div> 
        </ResourceHeaderTemplate> 
    </ScheduleTemplates> 
 
    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. 

Regards, 
Nevitha 
 


Riccardo Zucchetto
Replied On 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,
Riccardo

Attachment: SyncfusionBlazor_f7140eb4.zip

Karthigeyan Krishnamurthi [Syncfusion]
Replied On August 5, 2019 07:27 AM UTC

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


Uwe Hein
Replied On 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="17.2.0.40-beta" and Version="17.2.0.39-beta"
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.    
     regards
      Uwe

Hareesh Balasubramanian [Syncfusion]
Replied On 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.AddRazorPages(); 
            services.AddServerSideBlazor(); 
            services.AddSingleton<WeatherForecastService>(); 
            services.AddSignalR(e => { 
                e.MaximumReceiveMessageSize = 102400000; 
            }); 
        } 

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


Regards, 
Hareesh 


Uwe Hein
Replied On 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.

    regards

       Uwe

Hareesh Balasubramanian [Syncfusion]
Replied On 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. 

Regards, 
Hareesh 


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile
Live Chat Icon