Our powerful JS Calendar component


Post by ilyaskohistani »

Hi, It's first time using Bryntum calendar. When using bryntum calendar i have resources that are read only. but when i update an event or i want to add a new event i can see those resources in Calendar field of eventEdit. how to not show these resources in eventEdit but keep them in filter events left sidebar. You can see it on image as well.

Attachments
I want to keep all of these resources
I want to keep all of these resources
Screenshot 2022-09-29 152308.png (129.06 KiB) Viewed 133 times
I only want to keep the ones that are not highlighted
I only want to keep the ones that are not highlighted
Screenshot 2022-10-05 160819.png (144.69 KiB) Viewed 133 times

Post by Animal »

You can configure everything in the editor all the way down.

In this case, you'd need to configure your calendar features like this:

    // Features named by the properties are included.
    // An object is used to configure the feature.
    features : {
        eventEdit : {
            editorConfig : {
                // We are augmenting the configuration of the editor's child items - its widgets
                items : {
                    // We are augmenting the configuration of the resourceField
                    resourceField : {
                        // We are augmenting the configuration of the store
                        store : {
                            filters : [{
                                property : 'id',
                                value : 'bryntum'
                            }]
                        }
                    }
                }
            }
        }
    }

When I set up the "Basic" example with that, I get this:

Screenshot 2022-10-06 at 08.53.04.png
Screenshot 2022-10-06 at 08.53.04.png (103.1 KiB) Viewed 118 times

Store's filters config: https://www.bryntum.com/docs/calendar/api/Core/data/mixin/StoreFilter#config-filters

So that is an array of filter definition objects, as described here: https://www.bryntum.com/docs/calendar/api/Core/util/CollectionFilter

So in addition to simple filters which filter on a property name and a value, you can specify a filterBy function which takes the record and returns true or false to decide whether to filter it in or out.


Post by Animal »

The filters configuration on the Store isn't very clear. I'll fix it to look like this in the next release:

Screenshot 2022-10-06 at 09.19.09.png
Screenshot 2022-10-06 at 09.19.09.png (94 KiB) Viewed 118 times

Post by ilyaskohistani »

I tried all the ways you have mentioned and yet i see the same result. I have also attached my code example. I have tried all properties with this filter but no result at all.

Attachments
Here is a snippet from my code.
Here is a snippet from my code.
Screenshot 2022-09-29 152308.png (70.96 KiB) Viewed 109 times

Post by mats »

I assume you'd want to only keep the non-readOnly resources?

filters : [{
    property : 'readOnly',
    value : false
}]

Post by ilyaskohistani »

Yes, But no matter what property and value i set here it does not affect the result. it always show me all the resources. tried name, id, readOnly, eventColor nothing is working.


Post by tasnim »

Hi,
It's not working because there is a little bug we just caught. We created a ticket on that. Here it is https://github.com/bryntum/support/issues/5370

It's in ready-for-review status, It will be available in the next patch release

And here is an another way to achieve that:

const calendar = new Calendar({
    ...
    listeners : {
        beforeEventEditShow({ eventEdit }) {
            const store = eventEdit.resourceField.store;
            store.filter(item => !item.readOnly);
        },
        once : true
    }
});

Docs :
https://bryntum.com/docs/calendar/api/Calendar/feature/EventEdit#event-beforeEventEditShow

Good Luck :),
Tasnim

Attachments
fRxSPXMlSo.png
fRxSPXMlSo.png (102.38 KiB) Viewed 96 times

Best of luck,
Tasnim


Post by ilyaskohistani »

Thank you Tasnim!
This one worked for me. Much appreciate your helps and supports. Thanks Everyone.


Post Reply