将过滤器结果输出到文本框中

问题描述：

我正在尝试创建一个Web应用程序脚本，其中包含一个接受用户输入并返回结果的字段.我需要它列出与输入查询关联的所有结果.

I'm trying to create a web apps script with a field that accepts user input and returns the result(s). I need it to list all the results associated with the input query.

我尝试做的事情:

我已经为orderInput分配了一个实际的订单号，我能够使用Logger.log(orderMatch)获得想要返回的结果，所以我知道它可以工作.
我不确定是否遇到格式问题，所以我尝试使用orderInput.toString()将orderInput转换为字符串，但这没用.
起初，我试图在一个禁用的输入字段中显示它，但是它不起作用，所以我尝试使用textarea，但这也不起作用.
我还尝试过在return item[0] === orderInput });

document.getElementById("orderResults").value = (orderMatch);
M.updateTextFields();

我当时正在使用document.getElementById("orderNumber").addEventListener("change",orderLookup);来触发脚本的运行，但是我也尝试使用onclick="orderLookup()"创建一个按钮，但这没用.

I've assigned an actual order number to orderInput and I was able to get the results I wanted it to return using Logger.log(orderMatch) so I know it works.
I wasn't sure if I was running into a formatting issue so I tried converting orderInput to a string with orderInput.toString() and that didn't work.
At first I was trying to display it in a disabled input field and that didn't work so I tried using a textarea but that didn't work either.
I've also tried moving the document.getElementById("orderResults").value = (orderMatch); M.updateTextFields(); in various places between return item[0] === orderInput });
I was using document.getElementById("orderNumber").addEventListener("change",orderLookup); to trigger the script from running but I also tried creating a button with onclick="orderLookup()" but that didn't work.

这是我的脚本:

  function orderLookup() {

    var orderSheet = "Google Spreadsheet URL"

    var ss = SpreadsheetApp.openByUrl(orderSheet);
    var ws = ss.getSheetByName("Orders");
    var originalSheet = ws.getRange(2, 1, ws.getLastRow() - 1, 3).getValues();

    var orderInput = document.getElementById("orderNumber").value;

    var orderMatch = originalSheet.filter(function(item) {
      return item[0] === orderInput
    });

document.getElementById("orderResults").value = (orderMatch);
    M.updateTextFields();
  }

关于我的HTML:

      <div class="input-field col s2">
        <input value="" id="orderNumber" type="text" class="validate">
        <label class="active" for="orderNumber">Enter Order Number</label>
      </div>

      <center style="float:left;margin-left:0px;margin-top:0px;">
        <h6><b>Results</b></h6>
        <textarea id="orderResults" rows="10" cols="45" disabled="disabled" style="width:100%; height:auto"></textarea>
      </center>

答

假设:

单击Enter Order Number时要在工作表中查找数据.
您要查找第一列与您提供的输入匹配的行.
您希望该行中的所有数据都显示在<textarea>元素中.

You want to look for the data in the sheet when Enter Order Number is clicked.
You want to look for rows where first column matches the input you provided.
You want all the data in the row to show up in the <textarea> element.

可能的解决方法如下:

在label中创建一个onclick事件，该事件将在客户端运行一个函数:

Create an onclick event in the label, which will run a function on the client side:

<label class="active" for="orderNumber" onclick="search()">Enter Order Number</label>

接下来，通过onclick事件运行以下功能.此函数调用服务器端函数(orderLookup)，该函数将在工作表中查找匹配的数据并返回结果.

function search() {
  var input = document.getElementById("orderNumber").value;
  google.script.run.withSuccessHandler(showResults).orderLookup(input);
}

这是函数orderLookup:

function orderLookup(input) {
  var orderSheet = "Google Spreadsheet URL"
  var ss = SpreadsheetApp.openByUrl(orderSheet);
  var ws = ss.getSheetByName("Orders");
  var values = ws.getRange(2, 1, ws.getLastRow() - 1, 3).getValues();
  var orderMatch = values.filter(function(item) {
    return item[0] === input
  });
  return orderMatch;
}

如果orderLookup返回值，则将运行另一个客户端功能，该功能将获取匹配的数据作为参数，并将其写入<textarea>:

If orderLookup returns a value, another client-side function will run, which will get the matching data as a parameter, and will write it to the <textarea>:

function showResults(orderMatch) {
  var matches = "";
  for(var i = 0; i < orderMatch.length; i++) {
    matches = matches.concat(orderMatch[i], "\n");
  }
  document.getElementById("orderResults").value = matches;
}

因此，完整的代码如下:

So, full code would be the following:

index.html

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
  </head>
  <body>
      <div class="input-field col s2">
        <input value="" id="orderNumber" type="text" class="validate">
        <label class="active" for="orderNumber" onclick="search()">Enter Order Number</label>
      </div>

      <center style="float:left;margin-left:0px;margin-top:0px;">
        <h6><b>Results</b></h6>
        <textarea id="orderResults" rows="10" cols="45" disabled="disabled" style="width:100%; height:auto"></textarea>
      </center>    
  </body>
  <script>
    function search() {
      var input = document.getElementById("orderNumber").value;
      google.script.run.withSuccessHandler(showResults).orderLookup(input);
    }
    function showResults(orderMatch) {
      var matches = "";
      for(var i = 0; i < orderMatch.length; i++) {
        matches = matches.concat(orderMatch[i], "\n");
      }
      document.getElementById("orderResults").value = matches;
    }
  </script>
</html>

Code.gs

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

function orderLookup(input) {
  var orderSheet = "Google Spreadsheet URL"
  var ss = SpreadsheetApp.openByUrl(orderSheet);
  var ws = ss.getSheetByName("Orders");
  var values = ws.getRange(2, 1, ws.getLastRow() - 1, 3).getValues();
  var orderMatch = values.filter(function(item) {
    return item[0] === input;
  });
  return orderMatch;
}

我希望这是您想要实现的目标.

I hope this is what you wanted to accomplish.

将过滤器结果输出到文本框中

相关推荐