Several Clicks to reach desired date in Calendar Popup

I am using ChronoForm for my joomla registration in which I am asking user to enter Date of Birth. While testing I noticed that to reach to date of an old person (or go to few years back) one has to click several times on left arrow button.

Is there any workaround to this problem?

Thanks.

Hi gosain,

No good ones, you can use a different calendar, or set a default start date for this one.

Bob

I have no choice other than to make year and month selectable. For this I have to change the calendar otherwise current form will compel users to fill in incorrect details.

Could you please guide me what and where to look for implementing different popup calendar for datepicker field?

I would also like to know how to make datepicker field editable so that in case implementing new calender gets delayed users can still fill in the correct dates in all three date fields conveniently.

Could you also please tell me how can I add javascript for onSubmit event to change the entered dates (in 3 fields) in proper format e.g. dd/mm/yyyy or dd/mm/yy etc.?

Thanks.

Hi gosain,

The main calendar choices you have are the Aeron calendar that ChronoForms uses or the Digitarald standard Joomla calendar. You'll find links to the docs for both of them many times here in the forums - or with Google.

Bob

Thanks Bob, I followed your instructions and made changes in components/com_chronocontact/chronocontact.html.php and form->General (at the bottom) and now I see two different set of arrows for month and year. The selection is not so effective but so far so good, working for me.

😀

Thanks.

Bob do you know if there is any way to align the arrows up to the left and right of month and year after turning on navigation 2... the arrows are under the field and hard to see?


Thanks

Hi Mikec,

Absolutely no idea. But I think that the calendar is css configured so I guess you can change the styling and layout - see the Aeron calendar docs.

Bob

Hi Mikec,

I also noticed the same but there is not much I could do to solve this issue. What I found is that the same CSS code was used for previous arrow links for Month and Year. Similarly, the same code was used for next arrow links for Month and Year. This did not leave me any choice because change in position in both sets of previous and next links separately was not possible. However, I found a workaround to this problem by shifting set of all 4 arrows above month and year.

To do this, open components/com_chronocontact/css/calendar2.css in any text editor like notepad.

At line 51 you will find this section:

div.dashboard caption a {

In this section, change

top: 16px;

to

top: -6px;

Gosain.