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

Question

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 1

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.

Answer 2

This is an old question, but I have some ideas that could get you started (or anyone else who needs to do a similar task).

And the JavaScript to create the file content, and open the file:

var filedata = $('.start-time, .end-time, .Location').text();
window.open( "data:text/calendar;charset=utf8," + escape( filedata ) );

Presumably you'd want to add that code to the onclick event of a form button.

I don't have Outlook handy, so I'm not sure if it will automatically recognize the filetype, but it might.

Hope this helps.