DatePicker with 2 month


what would be the best approach to extend the DateField component, so that the popup will show 2 (or 3) consecutive months next to each other?

Thanks in advance for any hints!


One quick way could be to use a Window and add 2/3 InlineDateFields there, and then just use CSS to style it. It would then work purely on the server side, so each time the user changes the month, the first calendar would change immediately, but the others will need a server-roundtrip to update. So not the optimal approach, but would at least let you prototype with it.

If you wish to do it properly, and implement it on the client side, there are a couple of classes I would start with:

  • PopupDateField: extend this on the server side and add needed API
  • PopupDateFieldConnector: extend this and connect it to your server class
  • VPopupCalendar: extend this and add more VCalendarPanels to the “popup” in it

That’s the basic starting point. From there, just start poking at the API’s and hope that you don’t need to resort to copy-pasting all the code from some of the classes :slight_smile:

Thanks for the pointers Jouni!