PopUpCalendar component

I was creating a custom checkin page using IdocScript, and in that template I had a metadata field of type date. So I discovered that I need a pop-up calendar, where the user will not care about formating dates.

In Content Server, I found that there are a component called PopUpCalendar which adds pop-up calendars to checkin and search pages. So I said, I should use the same calendar object to give to my custom checkin page the same look and feel.

Note: This component is taken fromYahoo Developer Network, you can find there a lot of useful javascript objects, and part of the content server scripts are taken from there.

So to use that component in your template, do the following

1- If you will use it for custom checkin template, add the following include
<$include std_checkin_html_head_declarations$>

2- If you will use it for custom search template, add the following include
<$include std_query_html_head_declarations$>

3- Now I will assume that we have a metadata field called xPublishDate and we want to have a popup calendar for that field

<input id="xPublishDate" name="xPublishDate" size="20" maxlength="30" value="" type="text" READONLY>
<a href="javascript:pucToggleCalendar('xPublishDate')" style="vertical-align: middle;">
<img style="cursor: pointer; vertical-align: middle;" src="<$HttpWebRoot$>images/PopUpCalendar/calendar.png" border="0" width="20" height="19">
</a>
<script type="text/javascript">
pucCreateCalendar({ id: "xPublishDate", caption: "Publish Date"}, "xPublishDate");
</script>
<div id="puc_panel_xPublishDate_div" style="display: none;">
<div class="hd">Publish Date</div>
<div class="bd">
<div id="puc_calendar_xPublishDate_div"></div>
</div>
</div>