Forums

Datepicker

fribse 08 Aug, 2013
I'm using the mootools datepicker in the chronoforms.
I would very much like to have it start with the 20 year overview, and let the users zoom in.
I've set the options like this: startView: 'years', format: 'd/m-Y'
But it starts with the 1 year overview.
Any ideas?
GreyHead 08 Aug, 2013
Hi Fribse,

Please test with just the startView: 'years' option.

The format option is different for the MooTools datepicker: format: '%d/%m-%Y'

Bob
fribse 08 Aug, 2013
That doesn't change the initial display, it still shows the current month.
If I change the date format to the suggested, it shows it as %08/%08-%2013??
GreyHead 08 Aug, 2013
Hi fribse,

Hmmm . . . are you sure that you are using the MooTools datepicker?

Bob
fribse 08 Aug, 2013
It's set in the form, how so I verify it?
GreyHead 08 Aug, 2013
Hi Fribse,

Please post a link to the form so I can take a quick look.

Bob
fribse 09 Aug, 2013
PM is on it's way
GreyHead 09 Aug, 2013
Hi Fribse,

I can't work out why but although you have the MooTools DatePicker selected that is not what is being used in the form. If you look at the source files you will see that they are from /components/com_chronoforms/js/datepicker and not /components/com_chronoforms/js/datepicker_moo

I suggest that you upgrade to the latest version of ChronoForms and see if that magically fixes the problem.

Bob
fribse 09 Aug, 2013
Hi Greyhead
Ahaa, I see, I've updated it to V4 stable on the test site, and the datepicker looks very different now, and it does show the years, but it is now placed behind the rest of the window?
Stranger and stranger 😀
fribse 09 Aug, 2013
I'm not sure if this is the right way to fix it, but if I modify the
/components/com_chronoforms/js/datepicker_moo/datepicker_dashboard
file, so that the the class looks like this
.datepicker_dashboard {
	position: absolute;
	font-size: 10px;
	font-family: "Lucida Grande", LucidaGrande, "Lucida Sans", Geneva, Verdana, sans-serif;
	color: #fff;
	line-height: normal;
	width: 172px;
	height: 135px;
	padding: 14px;
	background: url(frame.png) no-repeat;
	z-index: 1;
}

Then the datepicker appears in front of the rest of the page.
GreyHead 09 Aug, 2013
Hi Fribse,

Please see this FAQ which has a CSS fix that doesn't require hacking the CF files.

Bob
fribse 09 Aug, 2013
Ahh, excellent, thankyou! I modified it to:
div.datepicker_dashboard {
  z-index: 10000 !important;
}

div.datepicker_vista {
  z-index: 10000 !important;
}

div.datepicker_jqui {
  z-index: 10000 !important;
}

To take care of the the different datepicker possibilities.
This topic is locked and no more replies can be posted.