Create .ics file with javascript or jquery

joshuahornby10 picture joshuahornby10 · Oct 2, 2013 · Viewed 59.6k times · Source

I am trying to create an .ics file when a user clicks a button.

So far the code I have is

msgData1 = $('.start-time').text();
msgData2 = $('.end-time').text();
msgData3 = $('.Location').text();

var icsMSG = "BEGIN:VCALENDAR\nVERSION:2.0\nPRODID:-//Our Company//NONSGML v1.0//EN\nBEGIN:VEVENT\nUID:[email protected]\nDTSTAMP:20120315T170000Z\nATTENDEE;CN=My Self ;RSVP=TRUE:MAILTO:[email protected]\nORGANIZER;CN=Me:MAILTO::[email protected]\nDTSTART:" + msgData1 +"\nDTEND:" + msgData2 +"\nLOCATION:" + msgData3 + "\nSUMMARY:Our Meeting Office\nEND:VEVENT\nEND:VCALENDAR";

$('.button').click(function(){
    window.open( "data:text/calendar;charset=utf8," + escape(icsMSG));
});

This downloads a .ics file but when I try to open this in iCal I am told it can not read the file.

Answer

smartbart24 picture smartbart24 · Nov 8, 2014

I used the ics.js solution mentioned by InsanelyADHD.

One problem with the solution was that Chrome did not detect the filetype correctly and tried to open the file as text with the editor.

I changed the download function to open the text simply with:

window.open( "data:text/calendar;charset=utf8," + escape(calendar));

My fork on Github is icsFormatter.js

Regarding the license: I have contacted the original author to include a GPL - after that I will include one too.