Event Calendar built with jQuery and ColdFusion

I recently had to build a shared calendar system for our home owners association to help keep track of our clubhouse usage. Since I had to go through the trouble, figured it would make a nice open-source project. It's called 'Event Calendar' and it is a jQuery and ColdFusion event calendar that works a lot like the Google Calendar system. With Event Calendar, you can share calendar information throughout your organization. There is also a simple user facade, that you can extend, to help control user rights.

I'll have it posted on RiaForge.org soon, but in the meantime you can download it at..

http://www.codfusion.com/blog/page.cfm/projects/event-calendar

Comments

Dogboy wrote on 01/28/101:43 AM

I've tested this on windows 7 in an xampp installation. Looks great but not working for me.

The "save" button on the jquery pop up does nothing. Cancel closes the box. Also the correct date and time are loaded. I've tested in firefox, ie and chrome.

I've set up the db and made the necessary changes to the files. Maybe the settings.js needs to point to a different jquery version?

John Mason wrote on 01/28/102:50 AM

That sounds like the AJAX calls aren't able to connect to the EventCalendar.cfc. In Firefox can you use FireBug and introspect the calls. You should see those calls and a simple JSON dataset returned back.

Dogboy wrote on 01/28/1012:05 PM

I made a stupid mistake. You were right - I wasn't calling the EventCalendar.cfc. I dropped your app inside of another folder on my webroot, but didn't add that folder to the settings.js file.

Thanks for your help!

Bill wrote on 01/28/102:07 PM

Hi John,

I'm not seeing the events that I've written to my database if I refresh the page.

Thanks for working on this. I've been using a calendar/appt app I built with Coldfusion 5 which needs to be updated. Your project looks like an excellent starting point!

John Mason wrote on 01/28/102:52 PM

@Bill,

You might have the same issue. Double check the table to make sure the entry you made got inserted. If not, you have a fairly simple communication issue to track down.

Bill wrote on 01/28/103:01 PM

The data is being written to my db. Once I create an event I can edit or delete it(as long as I don't refresh the page) and these changes are reflected in the events table. It seems that the getEvents function is not being called.

John Mason wrote on 01/28/103:16 PM

Hmm, that's interesting. Can you email your browser type and we can try to see what's up. My email is mason at fusionlink.com

Nick wrote on 01/29/102:02 PM

UI looks nice.

John Mason wrote on 01/29/103:00 PM

Just fyi for everyone, I posted an update to this last night. Just fixing a couple of issues I found. The jQuery plugin allows for resizing and drag n dropping of events as well. This is a really cool feature and some how I completely missed it. When you did a resize or drag n drop, it wasn't updating the db. That's fixed now.

@Bill, I got you email. I haven't been able to re-create your problem but I'll be spending some time this weekend to see if I can. I'll email you with my findings.

Marwan Narian wrote on 02/08/1011:08 AM

I am having the same issue as bill above. Events are written to database but not retrieved for display on page refresh. Getting Javascript error "data.DATA.id is undefined" on line 157 in settings.js.

John Mason wrote on 02/09/1011:06 AM

Ok, Bill and Marwan I think I've tracked down the issue. I just posted version 1.0.3 which should work for you. Internet Explorer's javascript date format is slightly different from everyone else which created this problem. The settings.js file now has a dateFormat() function to correct for this.

Thanks for alerting me to this and let me know if you run into any other problems.

Marwan Narian wrote on 02/09/1012:55 PM

Thanks John. Appreciate the quick reponse and for your contributions to the community.

I am still having the same error though. It is in the same function:

data: function(start, end, callback) {
$.getJSON($eventcalendarcfc+"?method=getEvents&returnFormat=json&queryFormat=column", {start: formatCFDate(start),end: formatCFDate(end)}, function(data) {
var result = [];
for(var i=0;i < data.ROWCOUNT; i++){
var eventObj = new Object();
eventObj.id = data.DATA.id[i];
eventObj.start = new Date(data.DATA.starttime[i]);
eventObj.end = new Date(data.DATA.endtime[i]);
eventObj.title = data.DATA.title[i];
eventObj.body = data.DATA.body[i];
eventObj.readOnly = data.DATA.readonly[i];
result.push(eventObj);
}
callback(result);

and the error in Firebug is:
data.DATA.id is undefined
eventObj.id = data.DATA.id[i];

I am running CF9 on Wind2k3, Apache, and Firefox 3.6 (not IE).

Regards.

Bill wrote on 02/09/102:50 PM

I'm seeing the same error on xampp in windows 7. I've tested this in most browsers with no luck.

John Mason wrote on 02/09/103:13 PM

Found it - it's a bug in how CF9 returns the JSON data. I'll see if I can make a quick fix for it.

John Mason wrote on 02/09/104:16 PM

Just posted version 1.0.4 which has a fix for the CF9 issue. I'll be blogging on that bug shortly.

Marwan Narian wrote on 02/11/102:38 PM

You got it John. Works great. Thanks a lot.

zaharin wrote on 03/05/108:07 AM

Hi John. Great work. It would be much better if you could add monthly view in this application.

John Mason wrote on 03/05/1011:57 AM

@Zaharin - Thanks, perhaps in the future

Brian wrote on 05/08/1012:18 AM

Hey John. Thanks for sharing. Works great!

Frank wrote on 10/28/1010:06 AM

I get this error when add an event.
The cause of this output exception was that: coldfusion.runtime.locale.CFLocaleBase$InvalidDateTimeException: oktober 28, 2010 20:30 is an invalid date or time string..

he error occurred in EventCalendar.cfc: line 129
127 :                ,<cfqueryparam cfsqltype="cf_sql_varchar" maxlength="200" value="#result.title#"/>
128 :                ,<cfqueryparam cfsqltype="cf_sql_varchar" value="#result.body#"/>
129 :                ,<cfqueryparam cfsqltype="cf_sql_timestamp" value="#result.starttime#"/>
130 :                ,<cfqueryparam cfsqltype="cf_sql_timestamp" value="#result.endtime#"/>
131 :                ,<cfqueryparam cfsqltype="cf_sql_varchar" maxlength="200" value="frank"/>

Simon wrote on 11/17/109:44 PM

Thanks John, great looking calendar and functionality. I'm having a problem - the Save button is not firing anything - I imagine it is something I have missed doing in the setup - it would be fab if you could suggest a starting point for me to look at (I'm new to jquery but have reasonable ColdFusion experience). Thanks again.
Simon

Marc Hale wrote on 02/01/113:33 PM

I'm having same problems. i have events in the table but they don't show. if i try to add one it does not allow me to save. using IE8 and CF6 or CF7

how do i set it up for all users as admin no requirements

John Mason wrote on 02/02/112:32 PM

@Marc,

You need to know the version of CF. CF 6 didn't have components.

Setting up users is in the Readme doc.

John Mason wrote on 02/02/112:38 PM

I seem to get a lot of "save" button problems. If the data isn't making it to the database. It's very likely you're not reaching the EventCalendar.cfc in the AJAX calls. The placement of the cfc is critical for things to work properly. You shouldn't need to alter any code. Just place the com folder in the root of your website (in most situations).

The best way to figure out what's happening is to use FireBug which is a plugin for FireFox. It can introspect the underlining AJAX calls. With FireBug, you should see those calls and a simple JSON dataset returned back. Check the AJAX call and make certain you have the CFC in the proper URL location.

Larry wrote on 06/01/1111:13 AM

Hi John

Great Calendar. I have it working, but am embarrassed to admit that I cannot figure out
how to configure userfacade.cfc to work with my user management. I am grabbing my user's Active Directory username and setting it as a session variable. I would like to use this username as the event calendar userID, so people can modify their own events.

Any chance of throwing up some example code for the userfacade.cfc? I have no idea how to accomplish this.

Thanks
Larry

John Mason wrote on 06/01/1112:34 PM

Thanks, yea this didn't come with a login procedure. The assumption is most people already have that. If you have a userid you have the get and set methods for that in the cfc. The isadmin method will need to work with your logic/auth to determine that. The userid can be anything you like. I username is fine.

CodFusion

Fusing Cod is a very bad idea ;)

Old Archived Blog