2016-08-27 173 views
2

我對這一切都很新穎,但我正在尋找直接從Google電子表格中填入名稱的Apps Script Web應用程序HTML下拉表單條目。到目前爲止,我已經能夠從電子表格的列A中返回一個名稱數組。此外,JS的「填充表單」部分成功填充HTML表單。從Google表格填充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> 
+0

您的HTML是否位於非Google網站? Google電子表格的側邊欄?一個Apps腳本Web應用程序? Google網站? –

+0

@Sandy_Good an Apps腳本網絡應用 –

回答

4

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> 
+0

@Hari_Das感謝您的回覆和文檔。我已經在表單下拉菜單中顯示電子表格中的第一個名稱的情況下取得了進展,但似乎沒有循環並獲取所有名稱,儘管日誌顯示了數組中的所有名稱。任何幫助讓它來拉所有的名字,將不勝感激。這裏是包含Apps腳本的[電子表格](https://docs.google.com/spreadsheets/d/1_gbVPyAIXHm4NktW793-3r7DWoKF2S1m19J5rjJ26-A/edit#gid=0)。 –

1

@HariDas給與後端代碼.GS一個偉大的答案,是一切工作的罰款。 你的web應用程序代碼也很好,你要作出一個小的變化:

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

這將現在這裏看到的遍歷數組,並把所有的結果: Web App

希望幫助:) 祝你好運!

+0

謝謝!那工作。 –