Google App Script to insert data to a google spreadsheet via POST or GET

action-script-google.js

/* 
   Version adjusted and updated October 2018 - Steven Kuipers
   * Removed some unnecessary variables and updated some obsolete methods (serviceLock)
   * Updated Usage to better reflect need to manage versions before each deployment. 
   -----  
  
   Copyright 2011 Martin Hawksey
   Original post - https://mashe.hawksey.info/2014/07/google-sheets-as-a-database-insert-with-apps-script-using-postget-methods-with-ajax-example/
   
   Licensed under the Apache License, Version 2.0 (the "License");
   you may not use this file except in compliance with the License.
   You may obtain a copy of the License at

       http://www.apache.org/licenses/LICENSE-2.0

   Unless required by applicable law or agreed to in writing, software
   distributed under the License is distributed on an "AS IS" BASIS,
   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
   See the License for the specific language governing permissions and
   limitations under the License.
*/

// Usage  

//  1. From Google sheet go to Tools > script editor

//  2. To Deploy: File > Manage Versions 

//  2. Publish > Deploy as web app 
//    - Choose latest version from step 2 - Repeat these two steps everytime you want changes to go live
//    - set security level and enable service (most likely execute as 'me' and access 'anyone, even anonymously) 
//
//  4. Copy the 'Current web app URL' and post this in your form/script action 
//
//  5. Insert column names on your destination sheet matching the parameter names of the data you are passing in (exactly matching case)


// If you don't want to expose either GET or POST methods you can comment out the appropriate function
function doGet(e){
  return handleResponse(e);
}

function doPost(e){
  return handleResponse(e);
}

function handleResponse(e) {
   // Lock service
  var lock = LockService.getScriptLock();
  lock.waitLock(5000);  // wait 5 seconds before conceding defeat.
  
  try {
    // next set where we write the data - We use the first sheet in the active spreadsheet
     var ss = SpreadsheetApp.getActiveSpreadsheet();
     var sheet = ss.getSheets()[0];   
    // we'll assume header is in row 1 but you can override with header_row in GET/POST data
    var headRow = e.parameter.header_row || 1;
    var headers = sheet.getRange(1, 1, 1, sheet.getLastColumn()).getValues()[0];
    var nextRow = sheet.getLastRow()+1; // get next row
    var row = []; 
    // loop through the header columns
    for (i in headers){
      if (headers[i] == "Timestamp"){ // special case if you include a 'Timestamp' column
        row.push(new Date());
      } else { // else use header name to get data
        row.push(e.parameter[headers[i]]);
      }
    }
    // more efficient to set values as [][] array than individually
    sheet.getRange(nextRow, 1, 1, row.length).setValues([row]);
    // return json success results
    return ContentService
          .createTextOutput(JSON.stringify({"result":"success", "row": nextRow}))
          .setMimeType(ContentService.MimeType.JSON);
  } catch(e){
    // if error return this
    return ContentService
          .createTextOutput(JSON.stringify({"result":"error", "error": e}))
          .setMimeType(ContentService.MimeType.JSON);
  } finally { //release lock
    lock.releaseLock();
  }
}

form.html

  <!-- 
       You'll find the url for the form action when you deploy the google action script. 
       More info at  https://www.stevenkuipers.nl/blog/google-sheets/using_google_sheets_as_db_using_ajax_requests/ 
  -->

  <form class="form-movie" action="" method="post">

    <h1>Simple Movie DB</h1>

    <div class="form-group">
      <label for="title">Movie Title</label>
      <input id="title" type="text" name="title" value="" placeholder="Movie title" required>
    </div>
    <div class="form-group">
      <label for="year">Year of movie release</label>
      <input type="number" name="year" min="1900" max="2099" step="1" value="2018">
    </div>
    <div class="form-group">
      <label for="rating">Rating</label>
      <input id="rating" type="number" name="rating" min="1" max="10" step=".1" value="7">
    </div>

    <div class="form-group">
      <button type="submit" name="button">Submit</button>
    </div>
  </form>