Scheduler Resources

[MilesGibson]

Has anyone used the Resources feature of the Scheduler? I am happy to see that it is possible to have multiple resources against a given calendar event, but the demos don’t cover this.
TIA,
Miles

[Hristofor]

Hi MilesGibson,
Here’s a demo that shows how to set two resources to each Scheduler event. Clicking on the radio buttons in the options area of the demo changes the order of the resources which determines the color of the events in the Scheduler. Resources are assigned to the events as key:value pairs, for example:

priorityId: 2,
employeeId: 2,

where the key represents the value of the resource and the value in the pair represents the id of the item from the resource dataSource property. Assigning resources to an event can also be done via the Window editor by double clicking on an event. You can read more about Scheduler Resources in the following dedicated topic.
Best Regards,
Christopher
Smart HTML Elements Team
https://www.htmlelements.com

[MilesGibson]

Thanks for that!  Does the scheduler work with a 1 event to 1 employee, or 1 event to many employee scenarios?
If I book an all-day event for the entire company of 500 people, I don’t want to have to create 500 events.  Right now I have an Events table that relates to Event-Employees, that is where I am storing the employees that are assigned to that event.  It looks like your scheduler accepts a List<Resource> of records, so I presume the former, but want to understand this better.
Thanks again,
Miles

[Hristofor]

Hi MilesGibson,
the Smart.Scheduler supports one resource item per event. That means that you can have any number of resources and an event can have any number of resources assigned but only one resource item per event. For example if you have a resource called employees its dataSource can contain a list of items where each item is a separate employee. You can assign one employee to an event since all employees are part of the same resource. However if you create the employees as separate resources instead you will be able to set multiple resources(employees) to an event, for example:

dataSource = [
 {
        label: 'Website Re-Design Plan',
        dateStart: new Date(year, month, date, 9, 30),
        dateEnd: new Date(year, month, date, 11, 30),
        andrew: 1,
        brian: 1,
        steven: 1
  }
];
resources = [
                {
                    label: 'andrew',
                    value: 'andrew',
                    dataSource: [
                        {
                            label: 'Andrew Olsen',
                            id: 1
                        }
                    ]
                },
                {
                    label: 'brian',
                    value: 'brian',
                    dataSource: [
                        {
                            label: 'Brian Reed',
                            id: 1
                        }
                    ]
                },
                {
                    label: 'steven',
                    value: 'steven',
                    dataSource: [
                        {
                            label: 'Steven Shields',
                            id: 1
                        }
                    ]
                }
            ];

Best Regards,
Christopher
Smart HTML Elements Team
https://www.htmlelements.com

[MilesGibson]

Ok,  thanks. I note in the DataSource example that the Resources all have the same Id.  Is that just a typo? I will figure out how to create a view that itemizes the resources for each event the way you have done in your example.  The list of resources can be pulled from the detail view, no problem.
Also: can I modify the appointment template?
FYI: The downloaded Visual Studio demo project is missing the Scheduler component from the main menu, plus the default view types don’t include Agenda, which I think is an important feature. It would be nice to see a demo component for Blazor in this project, but if I get one working, I will send it along.

[admin]

Hi MilesGibson,
1. The id here represents a property of the Event in the specific resource. It is not necessary to be unique id in this case.
2. No, it is not currently possible to modify the template for Scheduler Events.
3. The blazor-demos/pages folder contains the Scheduler Blazor page.
Best regards,
Peter Stoev
Smart UI Team
https://www.htmlelements.com/

[Tessie Soratos]

Thanks for the information!

[yasmani borowski]

I agree with you, the information was helpful

[FullStackDevATL]

We have implemented a scheduler in Angular (see versions below). The event has two properties that are used as resources (relationship manager ID and calendar entry type ID).

Everything works fine until you start “double” filtering. I am not able to pinpoint exactly when the problem occurs and replicate consistently.

Steps to reproduce:
1) Filter by employeeID
2) Filter by calendar entry type ID
3) Some back and fort with concurrent filtering.

4) At a certain point, you will notice that the current state of the filtered calendar is lost. For example, filtering by calendar type ID does not take in account the fact that the calendar is already being filtered by a certain relationship manager ID.

Is this a known issue?

Dependencies:

smart-webcomponents-angular: “^18.0.2″

angular/core”: “^16.2.12″,

—————————————————————————————-
<div>
<div>console.log(this.scheduler.resources);</div>
<div>console.log(this.scheduler.dataSource);

RESOURCES
[
{</div>
<div>”label”: “Relationship Manager”,
“value”: “relationshipManagerId“,
“dataSource”: [
{
“id”: “803a89ac”,
“label”: “Bob”,
“backgroundColor”: “black”
},
{
“id”: “3479d5743”,
“label”: “John”,
“backgroundColor”: “black”
},
{
“id”: “50f22103”,
“label”: “Yuri”,
“backgroundColor”: “black”
}
]
},
{
“label”: “Calendar Entry Type”,
“value”: “calendarEntryId“,
“dataSource”: [
{
“label”: “Custom Alert”,
“id”: “1”,
“backgroundColor”: “#3777bc”
},
{
“label”: “Notice 3”,
“id”: “3”,
“backgroundColor”: “#c59466”
},
{
“label”: “Notice 2”,
“id”: “2”,
“backgroundColor”: “#ff5966”
},
{
“label”: “Notice 4”,
“id”: “4”,
“backgroundColor”: “#a4be3a”
}]}]</div>
</div>
<div></div>
<div>Event Array (truncated)</div>
[{
“label”: “My label”,
“dateStart”: “2024-07-31T04:00:00.000Z”,
“dateEnd”: “2024-08-01T04:00:00.000Z”,
“allDay”: true,
“relationshipManagerId“: “803a89ac”,
“id”: 452,
“color”: “#012639”,
“backgroundColor”: “#ff5966”,
“calendarEntryId“: “2”,
“contractName”: “Sample”,
“relationshipManagerFullName”: “Bob Smith”,
“entryMessage”: “Contract End Date”
}

 

 

 

• This reply was modified 9 months, 2 weeks ago by FullStackDevATL.
• This reply was modified 9 months, 2 weeks ago by FullStackDevATL.
• This reply was modified 9 months, 2 weeks ago by FullStackDevATL.
• This reply was modified 9 months, 2 weeks ago by FullStackDevATL.

[Markov]

Hi,

The provided information is insufficient for replicating an issue on our side. Could you share the full details of your experiment?

Regards,
Markov

Smart UI Team
https://www.htmlelements.com/

[FullStackDevATL]

can I email the files to  support@jqwidgets.com?

[Markov]

Yes of course, you can

Regards,
Markov

Smart UI Team
https://www.htmlelements.com/

[FullStackDevATL]

Thank you Markov.

Before I send you the code, can you please confirm that the scheduler supports filtering by more than one resource at the same time?

In other words, if I filter the events by resource A, does a subsequent filtering by resource B go against the filtered events or against the initial unfiltered events?

[Markov]

Hi,

You should be able to filter by more than one resource in the scheduler. The different filter values are displayed in the legend bar, if it is enabled.

Regards,
Markov

Smart UI Team
https://www.htmlelements.com/

[Author]

Posts