Add to Calendar from a mobile website

Latest week I’ve been trying to search a way to add a Calendar event from a website in my movil to G calendar. In order to describe the task better, I leave this simple 3 steps process:

  • Make a very simple PHP page receive the variables (dates,title,description)
  • Detect the device
  • And switch to G calendar if it’s android or to other services depending on the platform, having a latest one click confirmation to add the event

After my first analysis I could conclude that is not the best take to do a mobile website with this approach.
So for now I left only an “Add to Calendar” button that links to google calendar.

A few comments about this weird implementation:
First things first, it doesn’t work right. It gives totally uncontrolled results. Last week is was working only on Desktop. This week works only on Android and in a PC browser it makes an everlasting redirect, a loop that threatens to break your browser :D

So the best take instead of making a javascript redirect to Gcalendar it would be to detect the device and offer the 3 main options, Android, iPhone calendar, and a generic iCal file to import in any other system.

But even doing that, this is not the best approach to do it in the mobile, the best would be to add it on one click to your calendar. And that cannot be done without doing a native Application.

So with this small example hosted at that I made in 3 days while I was on Holidays in Mallorca, I had the idea to make it open, push it to github and invite other developers that want to learn Datatables and Sencha Touch.

About this technologies:

  • Datatables is a javascript jquery based plugin to work with dynamic data using Json to interface with your data. Made by a very cool developer called Allan
  • Sencha Touch is an HTML5 framework to make mobile Applications based on EXT Js.

to be continued…

After this weekend with some code samples :)

Create a website or blog at

%d bloggers like this: