In this tenth episode of the CodeIgniter From Scratch screencast series, we will be exploring the Calendar library. We are also going to utilize the database class and jQuery AJAX. I will show you how to build a simple and CSS-styled calendar page, which will have the ability to store and display content for each day.
Catch Up
- Day 1: Getting Started With the Framework
- Day 2: Database Selecting Methods
- Day 3: Sending Emails
- Day 4: Newsletter Signup
- Day 5: CRUD
- Day 6: Login
- Day 7: Pagination
- Day 8: AJAX
- Day 9: File Uploading and Image Manipulation
- Day 10: The Calendar Library
Day 10: The Calendar Library
Other Viewing Options
- Follow us on Twitter, or subscribe to the Nettuts+ RSS Feed for more daily web development tuts and articles.
Enjoyed this Post?
Subscribe to our RSS Feed, Follow us on Twitter or simply recommend us to friends and colleagues!
By Burak Guzel
Burak Guzel is a full time PHP Web Developer living in Arizona, originally from Istanbul, Turkey. He has a bachelors degree in Computer Science and Engineering from The Ohio State University. He has over 8 years of experience with PHP and MySQL. You can read more of his articles on his website at PHPandStuff.com and follow him on Twitter here.
Join our newsletter!
Freelance Jobs
Create a Tutorial, Get Paid!
Have something to teach the world? Want to earn money doing it? Tutorials, screencasts, and articles published here on Nettuts+ are largely contributed by readers just like you! We'll pay you great money for good content. Find Out More
Thanks, very useful, maybe you could make a Facebook – CodeIgniter integration or a Star Rating System using CodeIgniter tutorial.
Plz can’t you put the database of this project.
It would be nice if the .sql file was included in this project.
Hello
Great Job..
Looking very nice.
Better to place database script in the download.
cheers :)
Krishna Mohan L V
Thank you for the available link to download the mp4 file. Its hard to me to watch the video online (in slow connection), so I need to download the file then watch on my PC. Very useful tutorial for me :D
Great programing! What do I need to do to get more events onto 1 cell/day? Since the key is the day, the key has to be unique. What would be an elegant way to show multiple events for 1 day?
In order to pull that off in a nice way – I actually modified the calendar library a bit. The standard gives you a good bit of control – but still can be somewhat limiting. Here’s what I have come up with that shows events spanning multiple days and can also cover the same days as well.
http://ttgdev.com/marsmedia/calendar/display/2010/06
Bryan
Hey, the multiple day spanning deal on that calendar looks pretty slick, do you have any code anywhere that we can look at for that?
Sure – give me a day or 2 and I will throw it together and give you a url. Trying to finish up the whole calendar :)
I wouldn’t mind getting a look and taking it for a test run.
Good things happening!
hi, the link above doesn’t load. could you show me how can i have multiple events in a single day?
This is odd, I can’t display any items for day_num values 1 to 9 … no single digit days.
I checked, the calendar events for those days are recorded in the database.
The data does appear in $cal_data being passed to $this->calendar->generate($year, $month, $cal_data);
But the resulting string does not include the calendar events for days 1 to 9.
Anyone else get this?
In the model, in function get_calendar_data, you have to strip off the leading ’0′ where applicable.
My solution:
–
function get_calendar_data($year, $month) {
$query = $this->db->select(‘date, data’)->from(‘sys_calendar’)
->like(‘date’, “$year-$month”, ‘after’)->get();
$cal_data = array();
foreach ($query->result() as $key=>$row) {
$cal_data[substr($row->date,8,2) + 0] = $row->data;
}
return $cal_data;
}
–
Adding a ’0′ in the cal_data assignment has the effect of converting the string ’01′ to the number ’1′ … solving the problem.
Hope that helps someone else.
thx a lot, this solved my problem ;) hope codeigniter will fix this in the next release
excellent, it save my times and my hairs :D
Or you can use phps intval() function to the substr($row->date, 8, 2);
cheers
big Thanks for the intval()!
Btw, entries would still not be removed unless accessed via a db manager like phpmyadmin (suppose you wish to delete a note by replacing it with a null value). The calendar would look empty but if you’ll scan the db, the entry is still there (with a null data value). maybe you could add a function that deletes the entry in case a null value is entered.
I changed my database structure so that I could enter multiple things for any one given date. My calendar is only displaying the most recent entry in my table. Can someone point me in the right direction as to what needs to change in the get_calendar_data function for multiple entries to display? Thanks!
I’m having a problem passing my config to the library. It just doesn’t seems to load it… anything I put in config it has no effect… any ideas what I could be doing wrong?
Thanks Burak,
Another great tutorial! I have it working perfectly in firefox/ safari but for some reason ie won’t do the post? Any ideas anyone?
I’m running Codeigniter on MAMP and IE is on windows in a Virtual Machine. Firefox in the same VM works fine.
I thought at first it might be something to do with the prompt so I created a modal to hold a form but still no dice.
I’m really stuck for ideas now so any help would be gratefully received!
Many thanks Burak, a terrific turtorial.
For those of you who dont know what to put in the ‘calendar’ table for this database, let me tell you it is very simple.
I am assuming that you are using WAMP, though this should work wherever you have phpMyAdmin installed.
Start phpMyAdmin, create a database ‘ci_series’.
Create a table ‘calendar’.
Have 2 columns: 1st named ‘date’ with type ‘DATE’
2nd named ‘data’ with type ‘VARCHAR’ and length about 100.
And then save the table.
And then just run the source code that you get from above, thanks to Burak.
Cheers,
Rishi.
@burak
Thank you very much for this very very nice tutorial.
God Bless you and Thank you!
thanks a lot….. may god bless tutplus network
the tutorial is php4 oop, i change to php 5 oop, seem like we cannot use $config word as our config variable , it generate error, must use any other than $config.
wao! waste so much time to figure wat wrong wif my code…
does it work for day which range from 1-9?
i cant get it work by entering the data, the tutorial also aim at day range from 10-31 only,
so anyone? or i make mistake?
hi, how am i suppose to put multiple events in the calendar? has anyone did this already?
Hi, im trying to do the same, if you know how, let me know please!
Thanks!
Hi, great calendar, nice programming, but im still trying to have multiple events for every day, could you please help me.
Thanks, have a nice day!
awesome tutorial. Any links for something like this that would allow multiple events on each day?
Very good, what about the old-fashion boring people who are usung IE though?? Tried on 6.0 and 8.0, can not update the calendar… Any advices? Thanks.
This is very useful, and nice
I can blank out a day to remove it but my date is still in the database how do i destroy it?
also i would like to add Start time and End Time for my events. The default times would be 9pm to 1am in-case ya need that.
i really learn alot from the codeigniter series tutorial, thanks
Got up to 8′ 30″ – the next and previous links do nothing – extremely frustrating.
same here, dont know how to continue. video is not up2date with the latest codeigniter
http://codeigniter.com/user_guide/libraries/calendar.html
I understand this is a simple tutorial (and it is very good quality), but I thought it was a bit odd at about 8-10 mins in where you create a model to handle setting up the calendar, and then inserting a great chunk of template into it. Surely this breaks the MVC model?
I am new to CodeIgniter (I come from Zend and bespoke frameworks) so I don’t know yet if this is actually expected practice when using their libraries. I would’ve thought that actually what you were doing was setting up a helper?
I love the CI session :) Can anyone give a hint how I could limit a calendar to 40 days, and possibly showing it as 2-3 months side-by-side.
See my post, i have a image too, I hope that can help u.
cheers
Peter
Hello all, and thanks to the author of this great tutorial.
Question: i made 2 calendars (outlook style) but i cant rid off, in the second calendar the next and prev links, i hope somebody can help me. I post in codeigniter if somebody want give some minutes to help
post: http://codeigniter.com/forums/viewthread/178388/
(las post is mine)
txs in advance
Peter
For Ci_series calender module database script is not available
Hi, i downloaded the page and configured it and it is working fine. Problem is with the single digit dates when entering the data in the box it is not showing in that div but it is storing in the database hope u understood my issue reply me the solution….Thanks
The source file is down. Please re-upload it.
if i have multiple events on the same day, how can i add, can i also make cell expand when more than one event is inserted on one same day
Thank you very much, very useful.
You can do
if($_SERVER['HTTP_X_REQUESTED_WITH'] == ‘XMLHttpRequest’)
in php to check jQuery ajax request
Duh!
CREATE TABLE IF NOT EXISTS `calendar` (
`date` date NOT NULL,
`data` text NOT NULL,
PRIMARY KEY (`date`)
) ENGINE=MyISAM DEFAULT CHARSET=latin1;
Hi and thanks for the tut Burak!
I see some comments about not being up to date with the latest codeigniter.
I am using the very latest and have no problem using the variable $config.
Also prefixing my classes with CI_ as in class Mycal_model extends CI_Model
It’s the same for all the CI classes now.
And they use __construct so it has to be parent::__construct; when initiating the parent class.
Other than that everything worked great with version 2.0.3. I also have the latest version of PHP installed if that is why it’s working right.
I styled it up some more and added a conditional check in the jquery that checks day_num and gives an alert if it’s a blank box and someone tries to enter data.
And it’s worth mentioning again, the problem with days 01 – 09 is fixed with intval() as mentioned in an earlier comment.
In the get_calendar_data function in the foreach loop it should look like this
$cal_data[intval(substr($row->date, 8,2))] = $row->data;
I wanted to add this if anyone happens to be using IIS server with PHP and can’t use these .htaccess files.
The web.config equivalent is below. My dir structure is www/nettuts_ci/ci_day10 so my web.config is:
Got that by using URL Rewrite (a nifty little extension for IIS put out by MS to try and compete with Apache) Ha! yeah right. But what ever, it works).
Ah man! Even with the pre tags it took out the xml.
Anyway if you have IIS take Burak’s htaccess code and put it in URL Rewrite
http://learn.iis.net/page.aspx/470/importing-apache-modrewrite-rules/
Forget the port binding steps and the hosts file junk. I have no idea what they are doing there but it’s not necessary.
Select the directory root of your application (not nessesarily default website as the instructions say)
When you import and apply it will auto put a web.config file with the correct settings in the app root you chose.
when i click “next”
http://localhost/mycal/2011/12
404 page not found
same error when click “prev”
Any help… Thanks
btw, i change display -> index
thanks a lot -> (from Belarus), yuo are genius !!!
hey.. i can’t see the content for the current date i.e. today. However, it is going to the database and then back the other way. but i can’t see it on the page
So I’m using CI 2.1.0 and got totally stuck at the .htaccess part of this tutorial. Everything was working smoothly until then. I’ve spent a day trying to figure it out to no avail.
The funniest thing is though when I download the source code and load the site from it, the file uploading and gallery work perfectly! That is without extending to CI_Controller or CI_Model, or without changing parent::Model() to parent::__construct() (which are normal changes needed for CI 2.1).
wtf?
What is going on here?
Wow it’s nice
wow… what a nice tutorial,i am very happy for such an informative tutorial.
Thanks so much…
Thanks for your help, you sir are an artist.
Great tutorial
greaaaaaaaaaaaaaaat work , its solved my problem completely
thanks a lott:-)