Выходной фильтр результатов в текстовое поле

Question

Я пытаюсь создать сценарий веб-приложений с полем, которое принимает вводимые пользователем данные и возвращает результат (ы). Мне нужно, чтобы перечислить все результаты, связанные с входным запросом.

То, что я пытался сделать:

1. Я назначил фактический номер заказа для orderInput, и я смогчтобы получить результаты, я хотел, чтобы он возвращался с помощью Logger.log (orderMatch), поэтому я знаю, что это работает.
2. Я не был уверен, что столкнулся с проблемой форматирования, поэтому я попытался преобразовать orderInput в строку сorderInput.toString () и это не сработало.
3. Сначала я пытался отобразить его в отключенном поле ввода, но это не сработало, поэтому я попытался использовать текстовую область, но это тоже не сработало.
4. Я также пытался переместить document.getElementById("orderResults").value = (orderMatch); M.updateTextFields(); в различные места между return item[0] === orderInput });
5. Я использовал document.getElementById("orderNumber").addEventListener("change",orderLookup); для запуска сценария, но я также пытался создать кнопку сonclick="orderLookup()" но это не сработало.

Это мой сценарий:

  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>

Answer 1

Что ж, мне кажется, что ваши функции на стороне сервера смешивания с функциями на стороне клиента, и я предполагаю, что поскольку вы предоставляете HTML-код и сценарий, который вы пытаетесь запустить, на стороне клиента.

function orderLookup() {
  var orderSheet = "Google Spreadsheet URL"
  var ss = SpreadsheetApp.openByUrl(orderSheet);//Server side function
  var ws = ss.getSheetByName("Orders");//Server side function
  var originalSheet = ws.getRange(2, 1, ws.getLastRow() - 1, 3).getValues();//Server Side function
  var orderInput = document.getElementById("orderNumber").value;//Client Side Function
  var orderMatch = originalSheet.filter(function(item) {return item[0]===orderInput});//could be either
  document.getElementById("orderResults").value = (orderMatch);
  M.updateTextFields();//dont know
}

Answer 2

Предполагая, что:

• Вы хотите искать данные на листе при нажатии Enter Order Number.
• Вы хотите искать строки, в которых первый столбец соответствует вводуВы указали.
• Вы хотите, чтобы все данные в строке отображались в элементе <textarea>.

Возможное решение будет следующим:

1. Создайте событие onclick в label, которое запустит функцию на стороне клиента:

<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>:

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

Итак, полный код будет следующим:

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;
}

Надеюсь, это то, чего вы хотели достичь.