[dev] Horde date picker

Sebastian Birnbach birnbacs at gmail.com
Mon Dec 18 13:45:18 UTC 2017


All,

meanwhile I succeeded in displaying the picker and I got rid of code that I
dont understand.
However, the picker does not seem to be linked to the form element I am
using. I am especially interested in linking it to a field of type text
(instead of YYYY-MM-DD selectors which I consider unhandy).

So, to clarify my previous question: how is the Horde_Calendar object
attached to a form element?


2017-12-18 12:41 GMT+01:00 Sebastian Birnbach <birnbacs at gmail.com>:

> 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?
>


More information about the dev mailing list