AngularJS Example:

HTML

<link rel="stylesheet" href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css">
<div ng-app>
     <h2>Calendar example</h2>

    <div ng-controller="CalendarCtrl">
        <form name="meetingDetails">
            <div>
                <input type="text" ng-model="startTime" placeholder="Start time, e.g. 9:30am" required="Missing start time" />
            </div>
            <div>
                <input type="text" ng-model="endTime" placeholder="End time, e.g. 10:30am" required="Missing end time" />
            </div>
            <div>
                <input type="text" ng-model="location" placeholder="Location, e.g. Jerusalem" required="Missing location" />
            </div>
            <input class="btn-primary" type="submit" ng-click="submit()">
            </button>
        </form>
    </div>
</div>

CSS

.done-true {
    text-decoration: line-through;
    color: grey;
}

JavaScript

function CalendarCtrl($scope) {

    var createIcs = function () {
        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:" + $scope.startTime + "\nDTEND:" + $scope.endTime + "\nLOCATION:" + $scope.location + "\nSUMMARY:Our Meeting Office\nEND:VEVENT\nEND:VCALENDAR";
        return escape(icsMSG);
    };


    $scope.submit = function () {
        if ($scope.meetingDetails.$invalid) {
            alert('Complete missing fields');
        }

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