如何将单元格中的日期从电子表格中提取到我的 HTML答案

【问题标题】：How can I pull a date in cell from spreadsheet to my HTML如何将单元格中的日期从电子表格中提取到我的 HTML
【发布时间】：2020-05-24 20:26:05
【问题描述】：

您能帮我使用 google app 脚本将电子表格中的一行数据提取到 HTML 表单中吗？

我找到并正在使用的代码和 HTML 如下所示。

我的电子表格如下所示（Bob 和 Mary 还没有预订航班）：

姓名，从城市，到城市，航班日期鲍勃，亚特兰大，东京，，约翰，纽约，巴黎，2020 年 11 月 8 日玛丽，芝加哥，柏林，

在 HTML 中，我输入了搜索词，即名称，它位于电子表格的第一列中。名称匹配的行应该被拉入 HTML。

这适用于 Bob 和 Mary，他们的行中没有日期。但是，John 的行没有传递给 HTML，因为日期会导致一些问题。

我尝试使用 JSON.stringify 和 new Date() 将日期传递到 HTML；但无济于事。尽管我搜索了该站点，但无法从搜索中解决。

$('#box3').val(sObj.box3);

当 sObj.box3 是电子表格中的日期时不起作用。

任何帮助将不胜感激。请注意，我对编码很陌生，在此先感谢您的回复和您的理解。我在电子表格和网页应用页面下方分享： spreadsheet

web app

function findNeedleInHaystack(sObj) {
  var sObj=sObj||{};
  sObj.column=sObj.column||1;
  sObj.needle=sObj.needle||22;
  sObj.haystack=sObj.haystack||'Sheet1';
  sObj.startrow=sObj.startrow||2;
  sObj.id=sObj.id||'16q1lFaLsZEZeImlkjaQNgCaAyA3ZS0QSrEO4dn872uc';
  sObj.found="No results ";
  var ss=SpreadsheetApp.openById(sObj.id);
  var sh=ss.getSheetByName(sObj.haystack);
  var rg=sh.getRange(sObj.startrow,1,sh.getLastRow()-sObj.startrow+1,sh.getLastColumn());
  var v=rg.getValues();

  for(var i=0;i<v.length;i++) {

    if(v[i][sObj.column-1]==sObj.needle) {
      sObj.box1= v[i][sObj.column];
      sObj.box2= v[i][sObj.column+1];      
      sObj.box3= v[i][sObj.column+2]; 

     break; 
    }
  }
    return sObj;
}
function doGet() {
  return HtmlService.createHtmlOutputFromFile('index')
      .setSandboxMode(HtmlService.SandboxMode.IFRAME);
}

还有 HTML：

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

</head>
<body>  
<br>
<br /><input id="txt2" type="text" value="John" placeholder="Enter 'John' and hit search" />
<br><input id="box1" type="text" />
<br><input id="box2" type="text" />
<br /><input id="box3"  />
<br />
<input type="button" value="Search" onClick="search();" />
<br>
<script>
  function search() {
    var s2=$('#txt2').val();

    google.script.run
    .withSuccessHandler(function(sObj){
      $('#box1').val(sObj.box1);
      $('#box2').val(sObj.box2);
      $('#box3').val(sObj.box3);
    })
    .findNeedleInHaystack({needle:s2});
  }
</script>

</body>
</html>

【问题讨论】：

标签： html date google-apps-script google-sheets

【解决方案1】：

这个答案怎么样？

修改点：

在您的 Google Apps 脚本端的脚本 findNeedleInHaystack() 中，sObj.box3 是日期对象。在这种情况下，当sObj返回到HTML端时，它就变成了null。我认为这是您的问题的原因。

为了避免这个问题，下面的修改如何？

修改脚本一：

请修改findNeedleInHaystack如下。

发件人：

return sObj;

收件人：

return JSON.stringify(sObj);

另外，请修改HTML端如下。

发件人：

google.script.run
.withSuccessHandler(function(sObj){
  $('#box1').val(sObj.box1);
  $('#box2').val(sObj.box2);
  $('#box3').val(sObj.box3);
})
.findNeedleInHaystack({needle:s2});

收件人：

google.script.run
.withSuccessHandler(function(sObj){
  sObj = JSON.parse(sObj)  // <--- Added
  $('#box1').val(sObj.box1);
  $('#box2').val(sObj.box2);
  $('#box3').val(sObj.box3);
})
.findNeedleInHaystack({needle:s2});

修改脚本2：

本模式中，作为简单的修改，请将findNeedleInHaystack修改如下。

发件人：

var v=rg.getValues();

收件人：

var v=rg.getDisplayValues();

修改脚本3：

在此修改中，日期对象被转换为字符串。请修改findNeedleInHaystack如下。

发件人：

sObj.box3= v[i][sObj.column+2];

收件人：

sObj.box3= v[i][sObj.column+2].toISOString();

参考资料：

【讨论】：

【解决方案2】：

我已经尝试了好几天了。感觉好像我在山洞里迷路了，你把我引向光明:) 我很感谢你的时间和帮助:) 你的建议对我来说非常有效，只是下面的内容似乎保持不变在我的情况下：

sObj.box3= v[i][sObj.column+2];

很高兴得到您的帮助，再次感谢您。最好的问候

【讨论】：