App Script Form to add a Calender Event

Google App Script allows you to automate work flows and create Add-ons with Google Sheets, Docs and Forms. It is also possible to integrate external Google Apps.

One example is to create a Google Calender Entry or Event with an App Script. The following code snipped gives you the idea how it works:

The function doget() is responsible to define the form to enter data needed to create the event. It defines the clickhandler of the submit button.

 function doGet() {  
  var app = UiApp.createApplication();  
  var form = app.createFormPanel();  
  var grid = app.createGrid(5, 3).setId('gridForm');  
  var eventTitle= app.createTextBox().setName("eventTitle").setTitle("Event Title");  
  var descr= app.createTextBox().setName("descr").setTitle("Description");  
  var lbFromDate = app.createDateBox().setName("lbFromDate").setFormat(UiApp.DateTimeFormat.DATE_TIME_SHORT).setTitle("From");  
  var lbToDate = app.createDateBox().setName("lbToDate").setFormat(UiApp.DateTimeFormat.DATE_TIME_SHORT).setTitle("To");  
  var btnSubmit = app.createButton("Create");  
  var titleRequired= app.createLabel("*").setId('titleRequired');  
  var lblFromDateRequired = app.createLabel("*").setId('lblFromDateRequired');  
  var lblToDateRequired = app.createLabel("*").setId('lblToDateRequired');  
  grid.setWidget(0, 0, app.createLabel("Titel"));  
  grid.setWidget(1, 0, app.createLabel("Description"));  
  grid.setWidget(2, 0, app.createLabel("Von"));  
  grid.setWidget(3, 0, app.createLabel("Bis"));  
  grid.setWidget(0, 1, eventTitle);  
  grid.setWidget(1, 1, descr);  
  grid.setWidget(2, 1, lbFromDate);  
  grid.setWidget(3, 1, lbToDate);  
  grid.setWidget(4, 1, btnSubmit);  
  grid.setWidget(0, 2, titleRequired);  
  grid.setWidget(2, 2, lblFromDateRequired);  
  grid.setWidget(3, 2, lblToDateRequired);  
  form.add(grid);  
  app.add(form);  
  //Controles and click handler  
  var submitHandler = app.createServerClickHandler('validateAndCreate');  
  submitHandler.addCallbackElement(eventTitle)  
   .addCallbackElement(descr)  
   .addCallbackElement(lbFromDate)  
   .addCallbackElement(lbToDate);  
  btnSubmit.addClickHandler(submitHandler);  
   return app;  
  }  

By pressing the submit button the function validateAndCreate will be executed. This function implements a simple check of the input data an creates the Google Calender Event within the given Calendar (defined by the Calendar ID).

  function validateAndCreate(eventInfo) {  
   var app = UiApp.getActiveApplication();  
   var flag = 0;  
   var currentTimestamp = new Date();  
   app.getElementById('eventTitle').setText("*");  
   app.getElementById('lblFromDateRequired').setText("*");  
   app.getElementById('lblToDateRequired').setText("*");  
   if (eventInfo.parameter.eventTitle== ''){app.getElementById('titleRequired').setText("* Title Required").setStyleAttribute("color", "#F00");flag = 1;}  
   if (eventInfo.parameter.lbToDate < eventInfo.parameter.lbFromDate){app.getElementById('lblToDateRequired').setText("* To Date must be later than From Date").setStyleAttribute("color", "#F00");flag = 1;}  
   if (eventInfo.parameter.lbFromDate == ''){app.getElementById('lblFromDateRequired').setText("* From Date required").setStyleAttribute("color", "#F00");flag = 1;}  
   if (eventInfo.parameter.lbToDate == ''){app.getElementById('lblToDateRequired').setText("* To date required").setStyleAttribute("color", "#F00");flag = 1;}  
   if (flag == 0){  
    var calendarId = "PUT_IN_HERE_YOUR_CALENDERID";  
    var startDt = eventInfo.parameter.lbFromDate;  
    var endDt = eventInfo.parameter.lbToDate;  
    var desc = eventInfo.parameter.desc + " created: " + currentTimestamp;  
    var title = eventInfo.parameter.eventTitle;  
    //Run the Crete event Function  
    createEvent(calendarId,title,startDt,endDt,desc);  
    app.getElementById('gridForm').setVisible(false);  
    app.add(app.createLabel("Event Created.");  
   }  
   return app;  
  }  
 function createEvent(calendarId,title,startDt,endDt,desc) {  
  var cal = CalendarApp.getCalendarById(calendarId);  
  var start = new Date(startDt);  
  var end = new Date(endDt);  
 //Manually set the Location, this can be modified to be dynamic by modifying the code if need be  
  var loc = 'YOUR LOCATION';  
 //Set the Options, in this case we are only using Description and Location, as we do not need Guests or sendInvites  
  var event = cal.createEvent(title, start, end, {  
    description : desc,  
    location : loc  
  });  
 }  

Then you can embed the App Script within your Google Sites page to visualize the form.