Jump to content


This topic is now archived and is closed to further replies.


A calendar with monthly overview, a possible solution using DOM

Recommended Posts

A while ago I posted a question here about a calendar with a monthly overview. I downloaded a couple of examples but then I got some inspiration myself: to use DOM. A search in the downloaded examples showed that they didn't use DOM so for the moment I ignored them.
I would like discuss the logic (different steps) here and get some reactions.

Step 1: A correct month
First I check the given month : if empty, not correct or invalid I use the current month. If correct (YYYYMM) I use the given month.

Step 2:  Create an empty month (table)
Using heredoc I create a table for the month. I don't know the number of rows, but I do know the number columns (7, one for each day of the week). In the thead I place a link to the previous month in the left column and a link to the next month in the right column. In the center (colspan=5) I place the month and year.
In the tbody I place a row with 7 cells (th) with the days of the week, starting with monday. I close the heredoc.
I put this string in a DOMDocument with loadHTML.
As main node I choose the tbody (getElementsByTagName) and I append a row (appendChild).
I determine the first day of the week using date("N", ...), if it is greater than 1 (=monday) I have to insert a number of empty cells. I give those cells a certain class with setAttribute.
After this I use a for loop to loop through the month from 1 to the number of days in the month (date("t", ...)). For each day I create a cell with a certain class and an id-attribute (id="d01", "d" + day of the month with 2 digits). In the cell I also place the day of the month.
Last, if the month doesn't end on a Sunday I have to add a number of empty cells.
I save this DOMDocument in a string using saveHTML

Step 3: Adding activities
I put the string in a DOMDocument using loadHTML.
I retrieve all the activities with the necessary data for the given month from database. I loop through this data and for each activity I determine the id ("d" + day of the month). Then I search the cell with the corresponding id. You can only use getElementById when your DOMDocument is linked to a DTD so I wrote a new function getElementByTagAndId. With this function I loop through all the cells until I find the one with the right id-attribute. The function returns a reference to this node. Next I test if this cell contains an unordened list. If not I add an unordened list, otherwise (this day has more than one activity) I refer to this node. I add a listitem with a link. The link points to a page with more information about this specific activity.
Once this is done for all activities I save the DOMDocument in a string with saveHTML.
Using echo or print you can show this month on screen.

For the moment I am interested in reactions on the logic. I am willing to publish the code and link to an example, but for the moment it is still quick and dirty, but I started rewriting it using OOP.


Share this post

Link to post
Share on other sites
I don't mean to sound uninterested, but your post is way too boring to actually read. Please summarize or show us some code, so that we may not have to decypher your story above.

I've had a fair share of dealings with the DOM extension, so I can probably help you out.

Dank u benedenbuurman.

Share this post

Link to post
Share on other sites


Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.