title: How do i get the date value from google spreadsheet database using javascript in google app script
body: <p>I am having a problem on why its showing nothing when i put date in the record on my google spreadsheet database. Cant figure out why, but when i delete the dates, it shows. I think that javascript cant read the dates from google spreadsheet? I tried to use <code>new Date()</code> but still not working. Pls help me with this. And also when i put like this </p>
  
  <pre><code>&lt;? var data = getData(); ?&gt;
          &lt;table id="tableShift2"&gt;
          &lt;caption&gt;Team unknown&lt;/caption&gt;
            &lt;th&gt;   Date and Time Plotted   &lt;/th&gt;
            &lt;th&gt;   LDAP   &lt;/th&gt;
            &lt;th&gt;   Date of VL   &lt;/th&gt;
            &lt;th&gt;   HD/WD   &lt;/th&gt;
            &lt;th&gt;   Action   &lt;/th&gt;
            &lt;? for (var q = 1; q &lt; data.length; q++) {?&gt;
            &lt;tr&gt;
              &lt;td&gt;&lt;?=data[q][1];?&gt;&lt;/td&gt;
            &lt;/tr&gt;
            &lt;?}?&gt;
          &lt;/table&gt;
  </code></pre>
  
  <p>it show the dates. So its like when in JS it not reading the date from database. Thats why i need your help guys how it make perfect the codings.</p>
  
  <p><strong>Code.gs</strong></p>
  
  <pre><code>function doGet() {
    return HtmlService
        .createTemplateFromFile('Index')
        .evaluate();
  
  }
  
  function getData() {
    return SpreadsheetApp
        .openById('17lKIhONfEeNogsBhKtGr4zVaLgH0_199-3J3-0tAdcE')
        .getActiveSheet()
        .getDataRange()
        .getValues();
  }
  </code></pre>
  
  <p><strong>Index.html</strong></p>
  
  <pre><code>    &lt;html&gt;
    &lt;head&gt;
      &lt;base target="_top"&gt;
  
    &lt;/head&gt;
  
    &lt;body&gt;
    &lt;? var data = getData(); ?&gt;
    &lt;div id="Options"&gt;
      &lt;label&gt;&lt;b&gt;Month&lt;/b&gt;&lt;/label&gt;
      &lt;select id="selectMonth"&gt;
        &lt;option value="0"&gt;-Select Month-&lt;/option&gt;
        &lt;option value="1"&gt;January&lt;/option&gt;       
        &lt;option value="2"&gt;February&lt;/option&gt;       
        &lt;option value="3"&gt;March&lt;/option&gt;       
        &lt;option value="4"&gt;April&lt;/option&gt;       
        &lt;option value="5"&gt;May&lt;/option&gt;       
        &lt;option value="6"&gt;June&lt;/option&gt;       
        &lt;option value="7"&gt;July&lt;/option&gt;       
        &lt;option value="8"&gt;August&lt;/option&gt;       
        &lt;option value="9"&gt;September&lt;/option&gt;       
        &lt;option value="10"&gt;October&lt;/option&gt;       
        &lt;option value="11"&gt;November&lt;/option&gt;       
        &lt;option value="12"&gt;December&lt;/option&gt;
      &lt;/select&gt; - 
    &lt;input type="radio" name="radioYear" id="radioYear" value="&lt;?= new Date().getYear(); ?&gt;"&gt; &lt;?= new Date().getYear(); ?&gt;
    &lt;input type="radio" name="radioYear" id="radioYear2" value="&lt;?= new Date().getYear()+1; ?&gt;"&gt; &lt;?= new Date().getYear()+1; ?&gt;
    &lt;button id="btnFetch" onclick="google.script.run.withSuccessHandler(fetchRecord).getData()"&gt;Fetch&lt;/button&gt;
    &lt;/div&gt;
    &lt;div  id="tables"&gt;
          &lt;table id="tableShift2"&gt;
          &lt;caption&gt;Team unknown&lt;/caption&gt;
            &lt;th&gt;   Date and Time Plotted   &lt;/th&gt;
            &lt;th&gt;   Name   &lt;/th&gt;
            &lt;th&gt;   Date of VL   &lt;/th&gt;
            &lt;th&gt;   HD/WD   &lt;/th&gt;
            &lt;th&gt;   Action   &lt;/th&gt;
          &lt;/table&gt;
    &lt;/div&gt;
    &lt;div id="date"&gt;&lt;/div&gt;
  
    &lt;script
  src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"&gt;
  &lt;/script&gt;
  &lt;script&gt;
  $(function() {
    google.script.run.withSuccessHandler(showData)
        .getData();
  });
  
  function showData(things) {
    var table = $('#tableShift2');
    for (var i = 0; i &lt; things.length; i++) {
      if (things[i][6] == '') {
      table.append('&lt;tr&gt; &lt;td&gt;' + things[i][1] + 
                   '&lt;/td&gt; &lt;td&gt;' + things[i][2] +
                   '&lt;/td&gt; &lt;td&gt;' + things[i][3] +
                   '&lt;/td&gt; &lt;td&gt;' + things[i][4] +
                   '&lt;/td&gt; &lt;td &gt;&lt;button onclick=\'ApproveAndRefresh("' + things[i][0] + '","' + things[i][2] +
                   '")\' id="btnApprove"&gt;Approve&lt;/button&gt; &lt;button onclick=\'DeclineAndRefresh("' + things[i][0] + '","' + things[i][2] + 
                   '")\' id="btnDecline"&gt;Decline&lt;/button&gt;&lt;/td&gt;&lt;/tr&gt;');
      }
    }
  }
  function ApproveAndRefresh(data, data1){
    google.script.run
    .withSuccessHandler(refreshData)
    .setApproved(data, data1);
  }
  
  function DeclineAndRefresh(data, data1){
    google.script.run
    .withSuccessHandler(refreshData)
    .setDeclined(data, data1);
  }
  
  function refreshData(hl){
     document.open();
     document.write(hl);
     document.close();
  }
  
  &lt;/script&gt;
    &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>