從 Google 表格填充 HTML 表單

Question

我對這一切還很陌生，但我希望使用直接來自 Google 電子表格的名稱填充 Apps Script Web App HTML 下拉表單條目。 到目前為止，我已經能夠從我的電子表格的 A 列中返回一個名稱數組。 此外，JS 的“填充表單”部分成功地填充了 HTML 表單。

我的問題是如何連接兩者？ 我已經嘗試用函數 getColleagueList() 替換 JS 后半部分中的硬編碼數組，並刪除該函數並只留下變量並且表單仍未填充。 我覺得這是一個簡單的解決方案，但不知道該怎么做。 提前致謝。

<!DOCTYPE html>
<html>
<head>
</head>
  <body>


  <select id="selectColleague">
    <option disabled selected value="">
      Reviewer's Name
    </option>
  </select> 

  <script type="text/javascript">

  //Gets Names
  function getColleagueList() {
     var s1 = SpreadsheetApp.getActiveSpreadsheet().getSheetByName('Roster Import');
     var range = s1.getRange(2, 1,s1.getLastRow()-1, 1).getValues();
     return range;
  }


  //Populates Form
  var select = document.getElementById("selectColleague");
  var options = ["1", "2", "3", "4", "5"];
    for(var i = 0; i < options.length; i++) {
      var opt = options[i];
      var el = document.createElement("option");
       el.textContent = opt;
       el.value = opt;
       select.appendChild(el);
  }
 </script>

Answer 1

getColleagueList() 應該是一個服務器端函數。 你可以把它放在 Code.gs 文件中。 然后從 JavaScript 調用服務器端函數，如下所示：您可以在此處了解更多信息： https : //developers.google.com/apps-script/guides/html/communication

<script>
          function onSuccess(values) {
            var select = document.getElementById("selectColleague");
            var options = values[0]; //Two dimensional array
            for(var i = 0; i < options.length; i++) {
                var opt = options[i];
                var el = document.createElement("option");
                el.textContent = opt;
                el.value = opt;
                select.appendChild(el);
            }
          }

          google.script.run.withSuccessHandler(onSuccess)
              .getColleagueList();
</script>

Answer 2

@HariDas 用后端 .gs 代碼給出了很好的答案，並且一切正常。 您的網絡應用程序代碼也很好，只是需要進行一些更改：

    var options = values[0]; 
    //change it to:
    var options = values;

現在將遍歷數組並給出所有結果，如下所示： Web App

希望有幫助:) 祝你好運！

從 Google 表格填充 HTML 表單

問題描述

2 個解決方案

解決方案1
4 已采納 2016-08-28 04:31:13

解決方案2
1 2016-08-29 10:33:34

從 Google 表格填充 HTML 表單

問題描述

2 個解決方案

解決方案1 4 已采納 2016-08-28 04:31:13

解決方案2 1 2016-08-29 10:33:34

解決方案1
4 已采納 2016-08-28 04:31:13

解決方案2
1 2016-08-29 10:33:34