Why won't my Google Calendar Script run?

Question

I am using Google Script to create a form that will create an event, as you can see from the code I have used two panels. I want to create multiple event forms on the 'parent' panel, I am trying to use the 'child' to hold information about the event. I want to run createEvent() on each child panel, but when I run it the script will not run and show this error message:

"Error occured: InternalError: Cannot find method createEvent((class),(class),(class),object)."

function doGet(){

 var app = UiApp.createApplication().setTitle('Create Events');

 //Create a penel which holds all the form elelemnts
 var parent = app.createHorizontalPanel().setId('parent');
 var panelOne = app.createVerticalPanel().setBorderWidth(2);

 var eventTitleLabel = app.createLabel('Event Title:');
 var eventTitle = app.createTextBox();
 var eventStartDateLabel = app.createLabel('Event Start Date:');
 var evenStartDate = app.createDateBox();
 var eventEndDateLabel = app.createLabel('Event End Date:');
 var evenEndDate = app.createDateBox();
 var eventDeatilLabel = app.createLabel('Event Details:');
 var eventDetail = app.createTextArea().setSize('150', '100');
 var eventButton = app.createButton('Create Events');
 var cancelButton = app.createButton('Cancel');

 panelOne.add(eventTitleLabel)
         .add(eventTitle)
         .add(eventStartDateLabel)
         .add(evenStartDate)
         .add(eventEndDateLabel)
         .add(evenEndDate)
         .add(eventDeatilLabel)
         .add(eventDetail)
         .add(eventButton)
         .add(cancelButton);

  var eventHandler = app.createServerClickHandler('createEvents');
  eventHandler.addCallbackElement(parent);

  //Add this handler to the button
  eventButton.addClickHandler(eventHandler);

  parent.add(panelOne);

  app.add(parent);

  app.close();
  return app; 
  }


  function createEvents(e){

  //Get the active application
  var app = UiApp.getActiveApplication();

  try{
      var eventTitle = e.parameter.eventTitle;
      var eventStartDate = e.parameter.eventStartDate;
      var eventEndDate = e.parameter.eventEndDate;
      var eventDetails = e.parameter.eventDetail;

      var cal = CalendarApp.getDefaultCalendar();
   cal.createEvent(eventTitle, eventStartDate,eventEndDate,{description:eventDetails});

app.add(app.createLabel('Event created Successfully'));
app.getElementById('panel').setVisible(false);
return app;
}

catch(e){
app.add(app.createLabel('Error occured: '+e));
return app;
 }
}

Answer 1

All the input widgets need a .setName() to be able to pass their values to the server function. https://developers.google.com/apps-script/guides/ui-service#ServerHandlers

Also consider using Logger.log() for debugging.

Answer 2

You simply forgot to set names to the widgets you want to get data from... in your example :

 var eventTitleLabel = app.createLabel('Event Title:');
 var eventTitle = app.createTextBox().setName('eventTitle');
 var eventStartDateLabel = app.createLabel('Event Start Date:');
 var evenStartDate = app.createDateBox().setName('evenStartDate');
 var eventEndDateLabel = app.createLabel('Event End Date:');
 var evenEndDate = app.createDateBox().setName('evenEndDate');
 var eventDeatilLabel = app.createLabel('Event Details:');
 var eventDetail = app.createTextArea().setSize('150', '100').setName('eventDetail');