How to Restrict Date Selection on Calendar

Continuing the discussion from Getting Started with App Connect Event Calendar:

we’re trying to allow dates to be selected between a specific start and end date (dynamically linked) in the calendar component.
selection of dates will be allowed within this date range.

Please help in understanding how this can be done?

https://fullcalendar.io/docs/visibleRange#:~:text=Sets%20the%20exact%20date%20range%20that%20is%20visible%20in%20a%20view.&text=The%20visibleRange%20object%20must%20have,other%20places%20in%20the%20API.

this is what we are trying to achieve!

ping!?

Just had a need for this.
This calendar range requirement is same as discussed here: How to determine calendar visible days' start/end date

@patrick Any way to set it in Wappler? Or any plans to add it?
I see there are numerous options which are not yet implemented in dmxCalendar. Is there some other way to set those? Or any will you guys have to add each as requests are posted here in community?

There was another requirement in some post for setting the sequence of elements in header, which is not available. Not to confuse the requirement here right now, but the situation is similar - something FullCalendar supports, but Wappler’s implementation does not.

Team, just add an advanced multiline field that gets appended to the calendar element options if there is content inside.

This multiline field should be similar to the one in SC API action body json and allow adding bindings.

This way anyone can add any options missing manually and create any array/object that is needed beforehand.

2 Likes

That is a great idea. Could this also allow for custom event binding?

Have you tried with event listeners?

Is that even an option right now?
From what I understood, docs say that event listener bindings should be done at the time of initialization.

Event delegation is used for that. I don’t know if in this case it would work, but it’s worth trying.

You lost me here. :sweat_smile:
Any sample code on what event delegation here means?

When using delegated events you are actually attaching the event to a parent element so then you can use it on child nodes.

Another option is to use the MutationObserver API.

All in all it would be great also to be able to pass an array of custom events to any component so they are attached on instantiation.

Maybe we should create a feature request from these two things: Advanced section where you have a multiline input to add additional object of options/config and another input where you can pass an array of events or similar.

1 Like

Check this library.

Thanks, taking a look at the links now.