Building the Current Year with a Web Page Calendar
In the previous part of this eight-part series on building a web page calendar, we began a discussion of how to get the program to display any month the user wished to see. In this part, we complete that aspect of the application, and take the first step to enabling it to display an entire year. This is the fifth part of the series.
Building the Current Year with a Web Page Calendar - Need for More Modification (Page 3 of 4 )
If you aim was to design a calendar of the current month or any other month, then what I have said in the series is enough. However, our aim is also to have a calendar for the current year and a calendar for any year of your choice. So we shall have to modify the IDs for the table cell elements of the single month calendar and the showMonth() function correspondingly.
When we have only one month, the ID of each table cell indicates the row and column of the table for the month. We now need to have 12 months, therefore we need 12 tables. The ID of each table cell should indicate not only the row and column but also the month. This is because all IDs on a web page must be unique. Following the way we have been giving IDs, we shall make the first character of a table cell be M, as before. The next character will indicate the month (January or February -- December); the following two will indicate the row and column respectively.
The Show Current Year’s Calendar and the Show any Year’s Calendar buttons will display twelve months. Under this condition, we shall use letters of the alphabet to represent the month. A will represent January, B will represent February, C March, until L will represent December. So a cell ID for the month of February in the second row and fourth column will be MB13.
What about the IDs for the cells we have for the single months (current month or any month)? There will now be four characters for the ID of each cell here, for the sake of consistency. However, the second character will be zero. So, for example, the cell in the second row and fourth column will be M013.
We also have to change the IDs of the Input Text controls (read-only) for the month and year for each month's calendar in a similar way.
Add zero after M for each of the cell IDs for the Table of the single month calendar you already have. Similarly add zero after ‘I’ for each of the IDs of the Input Text control for the single month calendar.
I will give you the final, complete code at the end of the series in a zip file format.
HTML 
Modifying a Web Page Calendar
