[dev] Horde date picker

[Sebastian Birnbach]

I am struggling to use the Horde date picker to stay as close to the Horde
framework as possible. I did some reverse engineering and came as far as
displaying the icon, embedding the date.js script and initializing the JS
object. However, a click on the icon does not produce the desired display
and the JS console says:

TypeError: div is null
  Horde_Calendar.draw()  calendar.js:92
  Horde_Calendar.open()  calendar.js:39
  onclick()              dossier2.php:1


In my form template I have this code:

<tr valign="top">
  <td align="right" width="15%"><strong>due date</strong></td>
  <td class="coreinput" style="display:none;"><input name="duedate"
id="duedate" type="text" value="<?php echo $this->vals['duedate']
?>"></input>
  <a onclick="Horde_Calendar.open('duedate', null)" title="Datum
auswählen"> <?php echo Horde::img('calendar.png', _("Calendar"),
'id="startimg"'); ?></a>
</tr>

and the processing file dossier2.php file comprises this:

Horde_Core_Ui_JsCalendar::init(array('full_weekdays' => true));
$GLOBALS['page_output']->addScriptFile('calendar.js');

This seems all very fine and sensible.
In an attempt to mimick a similar, working page done with Horde_Forms I
also added this JS code inline:

document.observe("dom:loaded",function(){document.observe('Horde_Calendar:select',
function(e) {var elt =
e.element();elt.up().previous('SELECT[name$="[month]"]').setValue(e.memo.getMonth()
+ 1);elt.up().previous('SELECT[name$="[day]"]').setValue(e.memo.getDate());elt.up().previous('SELECT[name$="[year]"]').setValue(e.memo.getFullYear());});});

However, I don't really know what I am doing and it does not work anyway.


What am I missing? What are the correct steps of embedding the date picker?