Creating forms using add-ons CSS and jQuery libraries
The same HTML code using the Google add-on CSS and jQuery libraries is as follows:
<!DOCTYPE html>
<html>
<head>
<base target="_top">
<!-- Google's Add-ons stylesheet //-->
<link rel="stylesheet" href="https://ssl.gstatic.com/docs/ script/css/add-ons1.css" />
<script src="//ajax.googleapis.com/ajax/libs/ jquery/1.10.2/jquery.min.js"></script>
<script>
// on document load, assign postData function to submit // button's onclick property.
$(function(){
$("#btnSubmit").click(postData);
});
// Calls server side function 'postFormDataToSheet'
// with form as the argument.
function postData(){
google.script.run
.withSuccessHandler(showSuccess)
.withFailureHandler(showError)
.withUserObject(this)
.postFormDataToSheet(this.parentNode);
}
/*
...