Create a Basic Calendar in php

Published 18 Nov by SuperNOVA

Create a Basic Calendar in phpCalendars are one of the most basic things one can achieve using the date functions of core php. So, instead of using a class/library which accomplishes this task, we will learn to make a calendar using the core functions provided by the php. We will start by doing some pretty basic stuff: Let’s see what is happening here. The first few lines are your simple DOCTYPE decleration and the most basic html tags. Now, in the php part we are simply changing the time zone to that of Asia/Calcutta. No issues here, you can change it to your preference. Next, we check that if there is a GET request specifying the year we will use that year. If not, we will use the current year. A similar approach is used for the month. Both of these are stored in the variables $year and $month. Now, the function print_calendar() is called with the $month,$year as parameters and its return value is echoed to the screen. This function will contain all the calendar dates etc computation.

The calendar printing function

So far, we have done pretty good. We have made basic structure that gets what the user needs. We even have a function that provides us with a calendar according to the month,year the user provides us. So, let’s fill up the function with some code, shall we: First of all, you should know that I have used a table to display the calendar and the table cells to display the dates in the calendar, but you can use any HTML element you wish like div/span etc. Now we store whatever we need to output in the variable $temp which we will return later. The first row contains the order of the days just for the convenience of the reader. Now, we use php’s cal_days_in_month() function to calculate the number of days in that month so that we can use a loop to display the dates. In the next two lines, we use the two functions: GregorianToJD() and jddayofweek() to get the first day so that we know when to start the output of the numbers in the loop. The next part is the loop that loops from $i=0 to $i<$days+$first_day. The reason for the upper limit to be as such is that if we use the limit to be $days then the loop will execute from i=0 to i=30 for example, for a month of 31 days and therefore, there will be no iteration to display the blank cells of the table. The next part is pretty simple.
  • We display a <tr> in the beginning which is decided by if($j%7==1).
  • Similarly, we display a </tr> at the end of every row.
  • We display the date as the variable proceeds if the counter is greater than/equal to the first day(obviously) and an empty cell if the counter is less than the first day. We give a class of cur to the td element if the date is today
Now, all this mess of code returns the table element that contains the calendar, if you run your code at this point, you should see something like this:
DEMO
SuMoTuWeThFrSa
  12345
6789101112
13141516171819
20212223242526
2728293031
Pretty ugly right, this is the point where we add some styling to the table to make it look bearable (at least). If you execute your script after applying the above CSS you should see something like this:
DEMO
SuMoTuWeThFrSa
  12345
6789101112
13141516171819
20212223242526
2728293031

Download the Calendar Script

Download

Extending this project

Firstly, this is barely a script let alone be a project. That said, a lot can be done to improve this script and a lot is already wrong with this. For example: The line that checks for the current date only checks the date and not month/year, so if you request a calendar for the previous month, it will still output the current date in bold. Sometimes you don’t want that.
  • We can add navigation to this so that we can easily navigate to the previous/next months/years.
  • Using javascript the calendar can be made very interactive by adding notes, to-dos etc.
  • We can make this a lot neater.

If you have any suggestions you are most welcome to share via comments/email.