title: How to access data form Google sheets html sidebar
body: <p>I'm trying to access the values in my custom sidebar menu. Been trying to find the solution for too long. </p>
  
  <p>My end goal is to create a new sheet in the active spreadsheet based on the response from the sidebar. </p>
  
  <p>"ReferenceError: "document" is not defined."</p>
  
  <pre><code>     var assessmentName = document.getElementbyId.myForm.assessmentName
  </code></pre>
  
  <p>Below is the full program.</p>
  
  <p><a href="https://docs.google.com/spreadsheets/d/1WQZxgz0jywmB3x-MQriBd7GLqpMpFu4XqR84tpHo8NQ/edit?usp=sharing" rel="nofollow noreferrer">https://docs.google.com/spreadsheets/d/1WQZxgz0jywmB3x-MQriBd7GLqpMpFu4XqR84tpHo8NQ/edit?usp=sharing</a></p>
  
  <pre><code>var ss = SpreadsheetApp.getActive();
    function onOpen() {
      var menu = [
  
      {name:"Add Marks", functionName:"addMarks"},
      ];
      ss.addMenu("MarkBook", menu);
    }
  function addMarks(){
     var ui = SpreadsheetApp.getUi();
     var html = HtmlService.createHtmlOutputFromFile('Index.html').setTitle('Add New Assessment');
      SpreadsheetApp.getUi().showSidebar(html);
  
           //test 0
              Logger.log(0)
              var assessmentName = document.getElementbyId.myForm.assessmentName
                Logger.log(assessmentName)
              var date = document.getElementbyId.date
                Logger.log(date)
              var assessment = document.getElementbyId.myForm.Assessment
                Logger.log(assessment)
              var input = document.myForm.input
                Logger.log(input)
  
      }
  
  
   //test 1 is in HTML file
  
  
  function submitData() {
  
      Logger.log(2)//test start
  
                google.script.run.getValuesFromForm(document.myForm)
  
                google.script.run.withFailureHandler(alert).withSuccessHandler(alert).submitform(form);
                Logger.log(myForm+2)
  
                var assessmentName =document.getElementById('assessmentName');
                google.script.run.withFailureHandler(alert).withSuccessHandler(alert).submitform(form);
                Logger.log(assessmentName+2)
  
                var date =document.getElementById.date('date');
                google.script.run.withFailureHandler(alert).withSuccessHandler(alert).submitform(form);
                Logger.log(date+2)
  
                var assessment =document.getElementById.myForm('Assessment');
                google.script.run.withFailureHandler(alert).withSuccessHandler(alert).submitform(form);
                Logger.log(assessment+2)
  
                var input =document.getElementById.myForm.input('input');
                google.script.run.withFailureHandler(alert).withSuccessHandler(alert).submitform(form);
                Logger.log(input+2)
  
        Logger.log("hi2")//test complete
  
   }
  
  
  
  function onSuccess() {     
  
  
  Logger.log(3)
     var assessmentName= document.getElementById('assessmentName').innerHTML = item;
      Logger.log(assessmentName+3)
  
     var date= document.getElementById.date('date').innerHTML = item;
      Logger.log(date+3)
  
     var assessment =document.getElementById.myForm('Name').innerHTML = item;
      Logger.log(assessment+3)
  
     var input= document.getElementById.myForm.input('input').innerHTML = item;
      Logger.log(input+3)
  
  
   Logger.log("hi3")
  
    }
  </code></pre>
  
  <p>HTML test in <code>&lt;head&gt;</code>. </p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
    &lt;head&gt;
      &lt;base target="_top"&gt;
       &lt;script&gt;
                  var assessmentName = document.getElementbyId.myForm.assessmentName
                  Logger.log(assessmentName)
                  var date = document.getElementbyId.date
                  Logger.log(date)
                  var assessment = document.getElementbyId.myForm.Assessment
                  Logger.log(assessment)
                  var input = document.myForm.input
                  Logger.log(input)
  
  
       function submitData(){
            Logger.log(1)    
  
                var myForm =document.getElementById('myForm');
                google.script.run.withFailureHandler(alert).withSuccessHandler(alert).submitform(form);
                logger.log(myForm+1)
  
                var assessmentName =document.getElementById('assessmentName');
                google.script.run.withFailureHandler(alert).withSuccessHandler(alert).submitform(form);
                logger.log(assessmentName+1)
  
                var date =document.getElementById('date');
                google.script.run.withFailureHandler(alert).withSuccessHandler(alert).submitform(form);
                logger.log(date)
  
                var assessment =document.getElementById('Assessment');
                google.script.run.withFailureHandler(alert).withSuccessHandler(alert).submitform(form);
                log(assessment+1)
  
                var input =document.getElementById('input');
                google.script.run.withFailureHandler(alert).withSuccessHandler(alert).submitform(form);
                log(input+1)
  
  
             Logger.log("hi1")
  
  
                }
               &lt;/script&gt;
    &lt;/head&gt;
  </code></pre>
  
  <p>Form to collect data to be used for edit google sheets. </p>
  
  <pre><code> &lt;body&gt;
  
       &lt;div&gt;
          &lt;form name="myFrom" id=myForm&gt;
  
                  Assessment Name:
                  &lt;br/&gt;
                  &lt;input type="text" placeholder="Assessment Name" name="assessmentName"&gt;
                  &lt;br/&gt;
                  &lt;br/&gt;
  
                  Date:
                  &lt;br/&gt;
                  &lt;input type="date" id="date"&gt;
                  &lt;br/&gt;
                  &lt;br/&gt;
  
                  Assessment Type:
                  &lt;br/&gt;
                    Formative&lt;input type="radio" name="Assessment" id="input" value="Formative"/&gt;
                    Sumative&lt;input type="radio" name="Assessment" id="input" value="Sumative"/&gt;
                  &lt;br/&gt;
                  &lt;br/&gt;
  
                  Input Method:
                  &lt;br/&gt;
                  &lt;select name="input" id="input"&gt;
                    &lt;option&gt;Manually Input Data&lt;/option&gt;
                    &lt;option&gt;Quiz Results Google Forms&lt;/option&gt;
                    &lt;option&gt;Kahoot Spreadsheet&lt;/option&gt;
                  &lt;/select&gt;
                  &lt;br/&gt;
                  &lt;br/&gt;
  
                  Sheet link:
                  &lt;br/&gt;
                  &lt;input type="url" placeholder="https://docs.google.com/spreadsheets/****" name="id"&gt;
                  &lt;br/&gt;
                  &lt;br/&gt;
  
          &lt;/form&gt;
         &lt;input type="submit" value="Submit" onclick="google.script.run.withSuccessHandler()" /&gt;
          &lt;button onclick="google.spript.run.submitData();" &gt;Save&lt;/button&gt;
  
           &lt;input type="button" value="Close Sidebar" onclick="google.script.host.close()" /&gt;
       &lt;/div&gt;
  
  
    &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>