Javascript 如何根据两个不同列中的两个参数搜索和筛选Google工作表_Javascript_Html_Google Apps Script_Google Sheets

Javascript 如何根据两个不同列中的两个参数搜索和筛选Google工作表

javascript html google-apps-script google-sheets

Javascript 如何根据两个不同列中的两个参数搜索和筛选Google工作表,javascript,html,google-apps-script,google-sheets,Javascript,Html,Google Apps Script,Google Sheets,我有一个46列的工作表，其中的行数是无限的。我正在寻找一种方法，以产生一个简单的用户界面，让我搜索两个标准和筛选出所有结果不符合这些标准的web应用程序。第一个是名称/emp#search，分别位于第3列和第4列。另一个是日期搜索。我的想法是，我可以搜索该日期的所有人员姓名或号码的实例，并将其作为html表或一些类似的均匀且合理间隔的表示返回下面是我目前试用的代码。我的知识非常有限，我想了解它是如何工作的，所以尽可能保持它的简单将是理想的。我已经能够使用TextFinder创建一个单框搜索，但

我有一个46列的工作表，其中的行数是无限的。我正在寻找一种方法，以产生一个简单的用户界面，让我搜索两个标准和筛选出所有结果不符合这些标准的web应用程序。第一个是名称/emp#search，分别位于第3列和第4列。另一个是日期搜索。我的想法是，我可以搜索该日期的所有人员姓名或号码的实例，并将其作为html表或一些类似的均匀且合理间隔的表示返回

下面是我目前试用的代码。我的知识非常有限，我想了解它是如何工作的，所以尽可能保持它的简单将是理想的。我已经能够使用TextFinder创建一个单框搜索，但我听说这可能会很慢，而且这张表的潜力很大。我也不知道如何用另一个类别进一步过滤它。我试着把第一个textfinder的结果通过另一个textfinder运行，但没有成功

代码.gs

function doGet() {
  return HtmlService.createTemplateFromFile('index').evaluate();
}

function getValuesFromSS(search) {
  var ss = SpreadsheetApp.getActiveSpreadsheet().getSheetByName('Sheet1');
  var lastRow = ss.getLastRow();
  var range = ss.getRange(1,3,lastRow,2); //define range for column D
  var ranges = range.createTextFinder(search).findAll();
  var names = '';
  var nums = '';
  var dates = '';
  var urls = '';

  //loop through each range
  for (i = 0; i < ranges.length; i++) {

    var row = ranges[i].getRow();
    var lastCol = ss.getLastColumn();
    var values = ss.getRange(row, 1, 1, lastCol).getDisplayValues(); //get all values for the row
    var empname = values[0][2]; //column C
    var empnum = values[0][3];  //column D
    var date = values[0][4];  //column E
    var url = values[0][46];

    names+=Utilities.formatString("<td>" + empname + "</td>");
    nums+=Utilities.formatString("<td>" + empnum + "</td>");
    dates+=Utilities.formatString("<td>" + date + "</td>");
    urls+=Utilities.formatString("<td>" + "<a href='https://drive.google.com/uc?export=view&id='" + url + "'>DVIR</a>" + "</td>");
}

return {
  first: names,
  second: nums,
  third: dates,
  fourth: urls
}
}

函数doGet（）{
返回HtmlService.createTemplateFromFile（'index'）.evaluate（）；
}
函数GetValuesFroms（搜索）{
var ss=SpreadsheetApp.getActiveSpreadsheet（）.getSheetByName（'Sheet1'）；
var lastRow=ss.getLastRow（）；
var range=ss.getRange（1,3，lastRow，2）；//定义D列的范围
var ranges=range.createTextFinder（search.findAll（）；
变量名称=“”；
var nums=''；
var日期=“”；
var url=''；
//在每个范围内循环
对于（i=0；i


index.html
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
  <script type="text/javascript">

    function setPageValues () {
    var search = document.getElementsByName('searchtext')[0].value;
      google.script.run.withSuccessHandler(disp).getValuesFromSS(search);
    }

    function disp(values){
      document.getElementById("results1").innerHTML = values.first;
      document.getElementById("results2").innerHTML = values.second;
      document.getElementById("results3").innerHTML = values.third;
      document.getElementById("results4").innerHTML = values.fourth;
    }
  </script>
</head>
<style>
table {
    border-collapse: collapse;
    }
tr { 
  display: block; 
  float: left; 
  }
td {
    border: 1px solid Black;
    display: block; 
    }
</style>
<body>
<input type="text" name="searchtext">
<input type="button" value="Search" onclick="setPageValues();">
<br>
<div name="resultbox">
<table>
<tr id="results1">
</tr>
<tr id="results2">
</tr>
<tr id="results3">
</tr>
<tr id="results4">
</tr>
</table>
</div>
</body>
<script>
</script>
</html>


函数setPageValues（）{
var search=document.getElementsByName（'searchtext'）[0]。值；
google.script.run.withSuccessHandler（disp.getValuesFroms（search）；
}
函数disp（值）{
document.getElementById（“results1”）.innerHTML=values.first；
document.getElementById（“results2”）.innerHTML=values.second；
document.getElementById（“results3”）.innerHTML=values.third；
document.getElementById（“results4”）.innerHTML=values.fourth；
}
桌子{
边界塌陷：塌陷；
}
tr{
显示：块；
浮动：左；
}
运输署{
边框：1px纯黑；
显示：块；
}



以下是示例电子表格链接：

如前所述，我希望在一个框中搜索名称或-emp#，在另一个框中搜索日期，并仅过滤与这两个框匹配的结果，以在html中显示。谢谢大家!
 
您不仅要在电子表格中搜索“驾驶员姓名”和“驾驶员编号”，还要搜索“日期”。

在这种情况下，存在只输入“驾驶员姓名”或“驾驶员编号”的情况。也有只输入“日期”的情况

您希望通过使用带有Google Apps脚本的Web应用程序来实现这一点

如果我的理解是正确的，那么这个答案呢？请把这看作是几个答案中的一个
修改点：

在这次修改中，日期输入标记被添加到HTML端
当输入“驱动程序名称”/“驱动程序编号”和“日期”时，这些值将作为对象发送到Google Apps脚本端
在GoogleApps脚本中，使用TextFinder搜索这些值。

TextFinder的处理成本低于搜索每行的处理成本。因此，我使用搜索“司机姓名”/“司机编号”和“日期”


修改脚本：
修改脚本时，请按以下方式修改
HTML端：index.HTML
发件人：
致：
及
发件人：
致：

在本例中，当运行Web应用程序时，您可以看到2个输入标记。

当您仅输入“驾驶员姓名”/“驾驶员编号”时，将显示通过搜索“驾驶员姓名”/“驾驶员编号”检索到的值
仅输入“日期”时，将显示通过搜索“日期”检索到的值
当您输入“驾驶员姓名”/“驾驶员编号”和“日期”时，将显示通过搜索“驾驶员姓名”/“驾驶员编号”和“日期”检索到的值


注:

在此修改后的脚本中，将使用您的共享电子表格。请小心这个
对于输出，使用了当前脚本和格式

参考：



如果我误解了您的问题，并且这不是您想要的方向，我很抱歉。
使用查询功能动态显示更改结果
使用过滤器指南的名称range1和命名range2来运行查询选择
 太完美了！非常感谢你！！！我试图解决这个问题已经有一段时间了，结果成功了！感谢您将其与原文保持一致，以便更容易理解。@n谢谢您的回复。我很高兴你的问题得到了解决。我发现了一个小问题。看起来搜索包含了标题，有没有办法排除第一行？“我知道我以前读过这方面的文章，我也会自己去想办法的。”谢谢你的回复。从你的问题中我没注意到这一点。这是因为我的英语水平差。对此我深表歉意。如果不想在搜索范围中包含标题行，请将getRange（1,3，lastRow，2）
和getRange（1,5，lastRow，1）
修改为g
function setPageValues () {
  var search = document.getElementsByName('searchtext')[0].value;
  google.script.run.withSuccessHandler(disp).getValuesFromSS(search);
}

function setPageValues () {
  var search = document.getElementsByName('searchtext')[0].value;
  var date = document.getElementsByName('date')[0].value;
  var obj = {};
  if (!search && !date) alert("No search values.");
  if (search) {
    obj.name = search;
  }
  if (date) {
    obj.date = date;
  }
  google.script.run.withSuccessHandler(disp).getValuesFromSS(obj);
}

<input type="text" name="searchtext">
<input type="button" value="Search" onclick="setPageValues();">

<input type="text" name="searchtext">
<input type="date" name="date">
<input type="button" value="Search" onclick="setPageValues();">

var range = ss.getRange(1,3,lastRow,2); //define range for column D
var ranges = range.createTextFinder(search).findAll();

var ranges = [];
if ("name" in search && search.name != "") {
  ranges = ss.getRange(1, 3, lastRow, 2).createTextFinder(search.name).findAll();
}
if ("date" in search && search.date != "") {
  var dateRanges = ss.getRange(1, 5, lastRow, 1).createTextFinder(search.date).findAll();
  if (ranges.length > 0) {
    ranges = ranges.filter(function(r1) {return dateRanges.some(function(r2) {return r1.getRow() == r2.getRow()})});
  } else {
    ranges = dateRanges;
  }
}