How to position a JQueryUI datepicker dialog via a MouseEvent - jquery-ui

Question

I'm trying launch a datepicker in dialog mode via clicking on some text.
<input type='hidden' id='datepicker'>
<div onclick="getdate()">
Click on me to launch DatePicker dialog
</div>
where
function getdate() {
$( "#datepicker" ).datepicker("dialog", "10/12/2013", function(){alert("wibble");},{dateFormat: "dd/mm/yy"},[20,20]);
}
Default dialog behaviour (no position) is fine (pops up centre screen), apart from Firefox which goes for top centre. Specifying position as Number[2] works fine as well.
The JQueryUI api documentation says:
pos
Type: Number[2] or MouseEvent
The position of the top/left of the dialog as [x, y] or a MouseEvent that contains
the coordinates. If not specified the dialog is centered on the screen.
Unfortunately, they have no example of using a MouseEvent and I fear that I am reaching the limits of my ability in this area. I tried various formats such as:
$( "#datepicker" ).datepicker("dialog", "10/12/2013", function(){alert("wibble");},{dateFormat: "dd/mm/yy"},$.Event("mouseclick"));
to no avail. Googling for datapicker dialog method seems to bring up a plethora of websites happy to parrot the api documentation without expanding on it.
How does one pass in a MouseEvent to this method?
Update
Based on j08691's answer, this is the syntax that I was looking for:
$( "#datepicker" ).datepicker(
"dialog",
"10/12/2013",
function(){alert("wibble");},
{dateFormat: "dd/mm/yy"},
event
);
Update 2
A bit more diddling on another computer with different versions of some browsers and a bit more research has led me to the following as my final answer:
<input type='hidden' id='datepicker'>
<div onclick="getdate(event)">
Click on me to launch DatePicker dialog
</div>
function getdate(e) {
e = e || window.event;
$( "#datepicker" ).datepicker(
"dialog",
"10/12/2013",
function(date){changeDate(date);},
{dateFormat: "dd/mm/yy"},
e
);
}
(where changeDate is another function)

Answer 1

It looks like the reason that there's not much on the web about this is that the only semi-useful, cross-browser event object mouse properties that you would use are event.pageX and event.pageY.
For example:
function getdate() {
$("#datepicker").datepicker("dialog", "10/12/2013", function () {
alert("wibble");
}, {
dateFormat: "dd/mm/yy"
}, [event.pageX, event.pageY]);
}
See this jsFiddle example and click on the grey div. The datepicker will be placed at the coordinates of where the mouse clicks on the div.

Answer 2

Try this :
<div onclick="getdate()">
<input type='hidden' id='datepicker'>
Click on me to launch DatePicker dialog
</div>