Dennis Mathis

Navigation

Skip navigation.

Search

Site navigation

Email conversation

FromDennis Mathis
ToMe
SubjectTrouble understanding date picker
Date18 May 2009 02:16
Mark,

I love your scripts. Implemented the iframe resize gizmo easily. (I'll be
careful to observe your licensing guidelines once I get the sawdust swept
up.)

Your date picker is also just what I need, but I'm having trouble
understanding the documentation. There are other such scripts available on
the 'Net, but I like your style and would prefer to use your gizmos when
appropriate. I just can't get my head around this script.

Here's the scenario -- I have a form with two text fields, one for
"start_date" and one for "end_date". I want to have a button next to each
field for the user to pick from the calendar, and I want the user's calendar
selection(s) to go into the appropriate field(s), then submit my form with
those entries.

You say to use the DatePickerReturn function to capture the returning stuff
from the calendar gizmo. Okay, but how? Obviously I have to customize
DatePickerReturn and, I guess, give it an argument so it knows which field
to populate. But where do I put the function?

I'm reasonably good with Javascript, but this one is too esoteric for me.
The DatePickerReturn seems to be floating in midair, picking up signals from
any openCalendar selection without knowing how to route the selection. Guess
I'm dense.

Seems to me it would be nice to have an argument for openCalendar() so the
user can specify which field in a form the selection is going to populate.

Your guidance would be welcome.

Dennis Mathis
FromMe
ToDennis Mathis
SubjectRe: Trouble understanding date picker
Date21 May 2009 09:44
Dennis,

> But where do I put the function?

Anywhere in any JavaScript that gets executed before the user opens the
calendar (such as an inline script, as shown in the comments at the top of
the script itself).

As for how to work out what input needs to receive the returned date,
whatever function opens the calendar can store a reference to the desired
input, and the datePickerReturn function can then use that.

<script type="text/javascript">
var currentInput;
function showTheCalendar(eventobj,inputname) {
  currentInput = inputname;
  openCalendar(eventobj);
}
function datePickerReturn( oDay, oMonth, oYear ) {
  if( !currentInput ) { return; }
  //in this example, the form has name="myform"
  document.myform[currentInput].value = oDay+'/'+oMonth+'/'+oYear;
  MWJwinStore.close(); //not documented, but it closes the calendar
}
</script>
...
<li><input name="foo"><a href="#" onclick="return false;"
onmouseup="showTheCalendar(arguments[0],'foo');return false;">Choose</a>
<li><input name="bar"><a href="#" onclick="return false;"
onmouseup="showTheCalendar(arguments[0],'bar');return false;">Choose</a>

Or you can use whatever approach is best for you to store the 'current'
input, so that your datePickerReturn function knows where to put the
response.


Mark 'Tarquin' Wilton-Jones - author of http://www.howtocreate.co.uk/
FromDennis Mathis
ToMe
SubjectRe: Trouble understanding date picker
Date21 May 2009 20:00
Oh, okay, I got it. It works.

"eventobj" is a little esoteric for me, I guess.

So openCalendar(eventobj) has as its argument this event, the click. And it
returns (or somehow makes available) three strings for day, month, year. Or
are they numbers?

Anyway, it works nicely.

Thanks.

Dennis Mathis
FromMe
ToDennis Mathis
SubjectRe: Trouble understanding date picker
Date22 May 2009 08:03
Dennis,

> "eventobj" is a little esoteric for me, I guess.

It is an optional event object, as described here:
http://www.howtocreate.co.uk/tutorials/javascript/eventinfo

It uses that event object to work out the mouse coordinates, in order to
open the calendar as close to the mouse as possible. This means that if
you choose to provide it, it needs to be a mouse event (not click, since
that will not reliably provide coordinates), such as mouseup, mousedown,
mouseover, mouseout or mousemove. Mouseup or mousedown are recommended.

If you do not provide an event object for it to use (or if it cannot
locate the mouse coordinates), it will default to opening wherever the
browser chooses to open it.

> returns (or somehow makes available) three strings for day, month, year.
> Or are they numbers?

It returns 3 numbers. If you want to provide leading zeros, you will
need to do that part yourself (I'd generally prefer to leave that part
to the server side script, since that will need to cope with a multitude
of formats provided by the user anyway if they type it manually instead
of using the calendar).


Tarquin
This site was created by Mark "Tarquin" Wilton-Jones.
Don't click this link unless you want to be banned from our site.