Our powerful JS Calendar component


Post by tornikezhizh »

Hello, I wonder why during month view start date and end date are like this? (27 - 24) not 1-30 or 1-31? and how can I make it appear dates from 1 to 30/31?

Attachments
Screenshot 2022-11-24 134447.png
Screenshot 2022-11-24 134447.png (31.22 KiB) Viewed 484 times

Post by tornikezhizh »

Or at least I need it to display full month, don't want last week to be cut


Post by Animal »

Calendars look like that.

Months do not always start on a Monday and finish on a Saturday. December 2022 starts on a Thursday as you can see.

You haven't layed out your Calendar with enough height to see it all.


Post by tornikezhizh »

thank you, can you at least tell me how to capture correct start and end date in dateRangeChange event handler?
event.new.startDate return 27 in that case on screenshot. so I need to somehow get 1st and 30th/31th


Post by Animal »

The daterangechange event passes correct data: 26th Jan to 8th Mar for February 2020. You can see that those are the cells in view:

Screenshot 2022-11-24 at 15.01.04.png
Screenshot 2022-11-24 at 15.01.04.png (1.17 MiB) Viewed 475 times

Just go to any example online, and in the debugger do

calendar.on('daterangechange', console.dir);

Post by Animal »

All cells visible must be loaded with correct data. Otherwise the UI would be wrong. Consider this very long event:

Screenshot 2022-11-24 at 15.06.12.png
Screenshot 2022-11-24 at 15.06.12.png (128.39 KiB) Viewed 475 times

It extends back in time into the previous month.


Post by tornikezhizh »

yes I agree, I just need dates, if you look on calendar, dates from previous month are gray and dates from current month are black. I need that startDate and endDate of current month if it's possible


Post by Animal »

You could override MonthView with these getters:

            get startDate() {
                return new Date(this.date.getFullYear(), this.date.getMonth(), 1);
            },
            get endDate() {
                return new Date(this.date.getFullYear(), this.date.getMonth() + 1, -1);
            }

Note that the is the last fully visible date inside the month. not the ending date of the month. You must decide which it is you want for your purpose. I of course do not know what your purpose is.


Post by Animal »

Data loading uses first visible date and last visible date, so this won't affect that. It just gets the information that you seem to need for your purpose.


Post by tornikezhizh »

My purpose is to get start date and end date of month


Post Reply