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

Question

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

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

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

姓名，从城市到城市，航班日期 Bob, Atlanta, Tokyo, , John, New York, Paris, 11/08/2020 Mary, Chicago, Berlin, ,

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

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

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

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

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

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

web 应用程序

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>

Answer 1

这个答案怎么样？

修改点：

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

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

修改脚本1：

请修改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：

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

从：

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

至：

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

参考：

获取显示值（）
toISOString()

Answer 2

这几天我一直在努力。 感觉好像我从迷路的山洞中被救了出来，你引导我走向光明:) 我很感谢你的时间和帮助:) 你的建议对我来说非常有效，只是下面的内容似乎保持不变在我的情况下：

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

很高兴得到您的帮助，再次感谢您。 此致

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

问题描述

2 个解决方案

解决方案1
1 已采纳 2020-05-24 22:19:18

修改点：

修改脚本1：

从：

至：

从：

至：

修改脚本2：

从：

至：

修改脚本3：

从：

至：

参考：

解决方案2
0 2020-05-25 03:38:36

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

问题描述

2 个解决方案

解决方案1 1 已采纳 2020-05-24 22:19:18

修改点：

修改脚本1：

从：

至：

从：

至：

修改脚本2：

从：

至：

修改脚本3：

从：

至：

参考：

解决方案2 0 2020-05-25 03:38:36

解决方案1
1 已采纳 2020-05-24 22:19:18

解决方案2
0 2020-05-25 03:38:36