Get the filtered events in the current view

[Ellen]

How can I get all the visible events in the current view?

I can't use the date range to do this since I'm using a filter to filter the events by resource. For instance, if I have events A, B, C using resource 1, E, F using resource 2, after I filter the scheduler by resource 2, only events E and F will be visible. How can I get those 2 visible events in the client side?

[Aleksandar]

Hello Ellen,

If my understanding is correct the requirement is to filter the events by resources and get reference only for the visible resources. This can be achieved by using the occurrencesInRange() method or occurrenceByUid() method. 

Attached is a runnable sample solution with a similar scenario implemented. A MultiSelect widget provides the option to select Events for a particular Meeting Rooms. The change event handler of the Multiselect updates the dataSource filter and filters the Scheduler's dataSource for the selected meeting rooms. Upon click of the Get Visible Events button a reference to the current view is obtained. All visible events for the view are obtained via the occurrencesInRange() method and logged on the developer console.

$('#btn').on('click', function () {
        var scheduler = $("#scheduler").data("kendoScheduler");
        var view = scheduler.view()
        var events = scheduler.occurrencesInRange(view.startDate(), view.endDate())
        console.log(events)
    })

I hope this will help you resolve your scenario. Should you have further questions please get back to me.

Regards,
Aleksandar
Progress Telerik

[Ellen]

Thanks for the reply.

 

However, my filter is based on a property of the resource. As shown below the events are filtered by the type Id of the resource. It seems like your example will no longer work.

 

var scheduler = $("#calendar").data("kendoScheduler");
var typeId = $("#type-selector").val();
if (typeId) {
    scheduler.resources[0].dataSource.filter({ field: "TypeId", operator: "eq", value: parseInt(typeId) });
} else {
    scheduler.resources[0].dataSource.filter({});
}
scheduler.view(scheduler.view().name)

 

By the way your example project uses MVC and doesn't specify the necessary package references (only Telerik is included), which makes it really hard to get it running.

 

Thanks

 

[Aleksandar]

Hello Ellen,

Calling scheduler.resources[0].dataSource.filter() would filter the resources data, but not the Scheduler events.

Note that each Scheduler event contains information on the resources selected for it, in the example provided the IDs of the attendees and id of the room where the meeting will be held:

What you can do is extend the filter to filter for a particular room and attendee, for example:

var filter = {
            logic: "and",
            filters:[
              {filter 1};
              {filter 2};
            ]
            })

I hope this helps. Let me know if you have further questions.

Regards,
Aleksandar
Progress Telerik

[Ellen]

Hi,

Thanks for the reply. Since the scheduler event normally will only contain the id of the resource (effectively event.resourceId), are you suggesting that the event can't access other fields of the resource object? So there is no way to do something like event.resource.typeId?

Thanks

[Aleksandar]

Hi Ellen,

The resource DataSource can be a JavaScript object which represents a valid data source configuration, a JavaScript array or an existing kendo.data.DataSource instance. However the resources.dataValueField field of the resource data item which represents the resource value. The resource value is used to link a scheduler event with a resource. By default, this is the `value` field of the DataSource, but you can change it to a different field, eg. typeId, and filter the resources following the suggested approach.

When you filter the Scheduler's DataSource, containing the scheduler events, you have access to the scheduler event fields and the resources text/value pairs as specified when setting the resources for the Scheduler.

Regards,
Aleksandar
Progress Telerik