[Google Script WebApp html从Google Spreadsheet搜索

问题描述 投票:0回答:2

我有一个Web应用程序,该应用程序具有将数据发送到Google Spreadsheet的表单。现在,我想创建另一个具有搜索功能的html页面,以从Google表格中提取数据并将其显示在我的html页面上。有没有办法做到这一点?请帮忙。我到处都看过,但是没有代码有帮助。预先感谢。

search google-apps-script google-sheets
2个回答
0
投票

您是要在外部(即在Google环境之外的自己的网站/服务器上)构建和托管此页面,还是要构建在G Suite中进行编码,管理和托管的网页?

如果是前者,则需要使用Google Sheets API才能从电子表格中提取数据。

如果是后者,请阅读Apps脚本的Web AppsHTML Service,使您可以在G Suite中构建和托管基本的Web应用程序。

如果您需要更多示例来工作,请在您喜欢的搜索引擎中尝试搜索字词“托管网络应用google应用脚本”。


0
投票

一个搜索对话框和Web应用程序

Code.gs:

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||'Spreadsheet ID';
  sObj.found="No results found";
  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.found=v[i];
     break; 
    }
  }
  return sObj;
}

function needleInHaystackDialog() {
  var userInterface=HtmlService.createHtmlOutputFromFile("aq6").setWidth(800);
  SpreadsheetApp.getUi().showModelessDialog(userInterface, "Needle In Haystack")
}

function doGet() {
  return HtmlService.createHtmlOutputFromFile("aq6").setWidth(600);
}

aq5.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 /><input id="txt1" type="text" placeholder="Sheet Name" />
<br /><input id="txt2" type="text" placeholder="Search String" />
<br /><input id="txt3" type="text" placeholder="Search Column Number" />
<br /><input id="txt4" type="text" placeholder="Start Row" />
<br /><input id="txt5" type="text" placeholder="Spreadsheet ID" />
<br /><textarea id="found" rows="2" cols="50"></textarea>,
<br /><input type="button" value="Search" onClick="search();" />
<script>
  function search() {
    var s1=$('#txt1').val();
    var s2=$('#txt2').val();
    var s3=$('#txt3').val();
    var s4=$('#txt4').val();
    var s5=$('#txt5').val();
    google.script.run
    .withSuccessHandler(function(sObj){
      $('#found').val(sObj.found);
    })
    .findNeedleInHaystack({haystack:s1,needle:s2,column:s3,startrow:s4,id:s5});

  }
</script>
</body>
</html>

我测试了对话框版本。它是第一次工作。您可以测试和调试doGet()。

© www.soinside.com 2019 - 2024. All rights reserved.