Public Typewriter Demo

by juberti

HTML

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
  </head>
  <body>
    <b>Typewriter Form Test Page</b>
    <form>
      <textarea id="note" name="note" rows="4" cols="80">Type something...</textarea>
      <br>
      <input type="submit" value="Submit" id="submit">
      <br>
      <div id="thanks" style="display:none;">Thanks for your message.</div>
    </form>
  </body>
  <script>
    var note = document.getElementById("note");
    var submit = document.getElementById("submit");
    var thanks = document.getElementById("thanks");
    submit.onclick = function(e) {
      e.preventDefault();
      var xhr = new XMLHttpRequest();
      var fd = new FormData();
      fd.append("note", note.value);
      xhr.onreadystatechange = function() {
        if (this.readyState == 4 && this.status == 200) {
          thanks.style.display = "block";
        }
      }
      xhr.open("POST", "https://script.google.com/macros/s/AKfycbwZjs-cBpr_WeFxHoV08ePbzmnNbcYzW20kILGWB15ZVkcv99r-/exec", true);
      xhr.setHeader("Content-Type", "application/x-")
      xhr.send(fd);
    }
  </script>
</html>