Current month changes after click on the 3 calendars view

[isamochernov]

When you select a date range in 3 calendars view and click on a non-current calendar, the view updates and the month I clicked in becomes the one at the centre. This behaviour confuses users a lot since they need to understand that the month has moved and they need to make the second click in a different month block. Please remove the feature or add an option to avoid month change when clicked on a date.

Когда мы выбираем диапазон дат в виде с 3-мя календарями и жмем не на текущий месяц, календарь обновляется и тот, на который мы нажали, переносится в центр. Такое поведение вводит пользователей в заблуждение, поскольку им необходимо понять, что текущий месяц изменился и второй клик надо делать в другом блоке. Пожалуйста, исправьте подобное поведение либо добавьте опцию для того, чтобы смены активного месяца при клике на дату не происходило.

[nazar-pc]

Yep, I thought about this. If you'll fix this faster than me, please, don't hesitate to send pull request.

[goranovs]

+1 on fixing that "feature"

[Nadoedalo]

Also it has weird behavior on month select - it lets to pick january of the next year without changing the current year

[EHLOVader]

+1 I would like to prevent this abrupt changing.

I also would like to make the current date be in the first calendar instead of the center or second one.

[EHLOVader]

Have a branch with part of the solution. It handles left and right alignment in addition to the default center alignment of the current selection.

It doesn't however handle completely static. You will always be shifted left or right but at least you can control which direction.

left align is best for times when you would want to primarily choose a future date. right align is best for times when you would want to choose past dates. center the default, would be best for selecting any surrounding date, within the prior or coming months.

Here is the branch. https://github.com/EHLOVader/PickMeUp/tree/calendar-alignment

Currently I don't see a smooth path to completely static where the months stay in place and don't move on each selection. But this is certainly a start.

[nazar-pc]

@EHLOVader, centered should be better just center, but what static means?

[EHLOVader]

Ah, that makes sense. I didn't give center much thought. It wouldn't ever require any explicit configuration. It was the default and I just needed to name it.

static is the last name I thought of, after left and right. It was a desired behavior not yet represented by the others. The idea would be no monthly movement whatsoever. This is likely the actual solution needed to fix the problems mentioned initially in this issue.

The only possible movement I think would make sense in static mode would be moving back or forward if selecting a date from the month just prior or after the shown dates. A not-in-month date.

Perhaps there would be a better name for that.

I couldn't see how it could be done though. Not easily like refactoring the alignment. I tried a bit and ended up with the days and month navigation off from each other.

[nazar-pc]

I think that should become just default behavior. I mean it shouldn't move anything anywhere implicitly, and alignment should have an effect on initialization or after hide/show cycle. In all other cases month switching will require to click arrow.

[EHLOVader]

My proposed static you mean? Certainly. I agree. Almost.

If you select June 2nd in this situation what would you have it do if static was chosen?

I still think it would be logical to move forward at least one month.

[nazar-pc]

I think we can eliminate static completely. If you click 2nd - it should stay at the same page, I found a bit confusing for people if calendar switches months by itself. For instance if you'd like to choose from 31 March till 2nd June - it shouldn't switch anything automatically, let user control situation, otherwise there will be at least 2 more clicks. Of course, we can do that configurable, but I do not think it worth such overcomplication.

[EHLOVader]

Oh. I see. No static as a specific alignment but no assigned alignment would behave in this way.

Perfect.

I think the fringe cases like mine, which is more of a single selection scenario could be solved with events.

Now how....

[EHLOVader]

@nazar-pc When you have a moment, check my branch I mentioned again.

I think I've got it.

No movement without alignment. If you align right selected date always moves right. Align left and it goes left. center will keep it as close to the middle as possible.

Potential exists for an initial state to be set too. Right now it is left aligned.

[mbaev]

Thanks @EHLOVader! Your fix is helpful for me. @nazar-pc Thank you for the best datepicker! I'll make "light" styles. If you want I can fork out and create PR for you. The theme based on bootstrap sass.

[nazar-pc]

I'm pretty sure in every case styling is unique, but something like gallery of examples is a good idea indeed. I'd like to have demo on jsfiddle with your styling (there is new link in readme for demo because of recent jsfiddle changes), so that I can create wiki page with links to such themes.

[mbaev]

Thanks! Please, take this one: https://jsfiddle.net/t0zxjd07/2/

[EHLOVader]

When I view it the day headers are offset. At first I thought it was just the multi month view, but it appears to be in all cases.

[mbaev]

Yes, you right. But my styles based on bootstrap and with these styles the calendar looks much better. I attached bootstrap css. https://jsfiddle.net/t0zxjd07/4/

[nazar-pc]

Hi everyone here, I've worked on this issue today and it should be fixed in aad08c7.

Could you all try build from master branch before I release it (there was quite a lot changes)?

[mbaev]

I can do this today about 9PM (GMT+4)