create .ics file on the fly using javascript or jquery?

AJSwift picture AJSwift · Dec 13, 2011 · Viewed 27.6k times · Source

Can someone tell me if there is any jquery plugin to dynamically create .ics file with values coming from the page div values like there would be

<div class="start-time">9:30am</div>
<div class="end-time">10:30am</div>
<div class="Location">California</div>

or javascript way to dynamically create an .ics file? I basically need to create .ics file and pull these values using javascript or jquery? and link that created ics file to "ADD TO CALENDAR" link so it gets added to outlook?

Answer

Defigo picture Defigo · Jan 14, 2013

you will need to make it in ICS format. also you will need to convert the date and time zone; E.G. 20120315T170000Z or yyyymmddThhmmssZ

    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";

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

the above sample will create a ics file for download. the user will have to open it and outlock, iCal, or google calendar will do the rest.