New jQuery Weekly Calendar Plugin
After being inspired by the recent fullcalendar (month based) plugin by Adam Shaw, I decided to port a weekly calendar i’ve been working on into a proper jquery plugin. Until a couple of days ago it was practically impossible to use this calendar functionality outside of it’s host application but now it should be simple to integrate it into any jquery-ui based application.
I made a conscious decision to base the week calendar api off the fullcalendar plugin, using the same event names where it makes sense and most importantly to use an identical data format. The idea being that the two plugins could co-exist utilising an identical data source and similar programming style.
You can see the full details of the plugin on the project page but to summarise the feature set:
- Display of calendar events within a weekly grid
- Calendar events can be supplied as an array, url or function returning json
- Calendar events can be dragged, dropped and resized
- Lots of callbacks for customizing the way events are rendered plus callbacks for drag, drop, resize, mouseover, click etc
- Automatically scrolls to current time
- Extend the core calendar event data structure with your own data
- Compatible with FullCalendar data sources with very similar events
jquery week calendar
At this stage there is only a basic demo in place but when time permits i’ll add a series of demos that help to show how you might extend it to fit your application requirements such as:
- Modification of rendered events based on custom data / logic
- Using jquery ui dialog for creating and editing events
- Using some of the other events to provide a better experience
This plugin is an early release and i’d expect follow up revisions to be coming out very soon. Any feedback, bug reports etc would be welcome.
July 4th, 2009 at 10:39 pm
Hi super Work, i liked to use but in German we have not AM & PM we runing on 1 – 24. How can i change this ?
July 22nd, 2009 at 7:22 pm
Hey Ralf. You can do this on the calendar events themselves using a date format but I think you might be talking about the time-slots on the left. This is currently not possible via config. Feel free to log a feature request on google code.
http://code.google.com/p/jquery-week-calendar/issues/list
I’ve not had a chance to do any work on this for the last month but will hopefully set a bit of time aside soon.
October 11th, 2009 at 9:11 pm
good work, but this is not working in IE 6
October 20th, 2009 at 8:10 pm
[...] New jQuery Weekly Calendar Plugin This jQuery Weekly Calendar Plugin makes it simple to integrate into any jQuery-UI based application. It’s based off the fullcalendar plugin, using the same event names where it makes sense and most importantly to use an identical data format. Now the two plugins can co-exist utilizing an identical data source and similar programming style. [...]
October 21st, 2009 at 12:13 am
[...] New jQuery Weekly Calendar PluginThis jQuery Weekly Calendar Plugin makes it simple to integrate into any jQuery-UI based application. It’s based off the fullcalendar plugin, using the same event names where it makes sense and most importantly to use an identical data format. Now the two plugins can co-exist utilizing an identical data source and similar programming style. [...]
October 26th, 2009 at 1:07 am
Great plugin, going to have a closer look at it later this week
October 26th, 2009 at 8:51 pm
Hey, Rob, I implement your code for asp.net mvc framework in http://juqerymvc.codeplex.com/
thanks
October 29th, 2009 at 10:02 am
[...] New jQuery Weekly Calendar Plugin [...]
December 15th, 2009 at 11:08 am
[...] New jQuery Weekly Calendar Plugin [...]
February 1st, 2010 at 6:16 pm
Hi, I found a rendering problem when applying border between tasks in a day. it render fine in several days, but it’s not rendering perfectly in other days. How should I make it rendered consistently between days?
steps to create the problem.
1. apply border in the weekly calendar css.
2. create 3 tasks in a day, between several days in a week.
3. see that the border between tasks is applied in several days, but it won’t rendered perfectly in other.
thanks and regards.
ipank
March 9th, 2010 at 10:49 pm
[...] Weekly Calendar sets up a great looking calendar very similar in functionality to Google Calendar. [...]
March 11th, 2010 at 8:57 am
[...] Weekly Calendar sets up a great looking calendar very similar in functionality to Google Calendar. [...]
March 19th, 2010 at 1:55 am
[...] Weekly Calendar sets up a great looking calendar very similar in functionality to Google Calendar. [...]
April 21st, 2010 at 3:11 pm
[...] Weekly Calendar sets up a great looking calendar very similar in functionality to Google Calendar. [...]