簡體   English   中英

帶有HTML表單的Google Apps腳本

[英]Google Apps Script with HTML Forms

我正在使用HTML邊欄的Google加載項上工作。 邊欄具有帶復選框的HTML表單。 我希望根據一些已經初始化的用戶屬性,在用戶打開側欄時選中某些復選框。 (提交表單后,屬性將更新。它們都從on開始)。 這是側邊欄的代碼:

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
    <title>Settings</title>
    <script>

    function onSettingsOpen()
    {

        Logger.log("In the script");
        console.log("In the script");

        document.getElementById(propsList[0]).checked = (allPreferences.getProperty(propsList[0]) === "true");


        document.getElementById(propsList[1]).checked = (allPreferences.getProperty(propsList[1]) === "true");
        document.getElementById(propsList[2]).checked = (allPreferences.getProperty(propsList[2]) === "true");
        document.getElementById(propsList[3]).checked = (allPreferences.getProperty(propsList[3]) === "true");
        document.getElementById(propsList[4]).checked = (allPreferences.getProperty(propsList[4]) === "true");
        document.getElementById(propsList[5]).checked = (allPreferences.getProperty(propsList[5]) === "true");

    }

    </script>
  </head>
<body onload="onSettingsOpen()">

<form id="baseSettings" onsubmit="event.preventDefault(); google.script.run.processForm(this)">




  <h2>What settings would you like to be on? Please select all that apply.</h2>
  <br>

  <input type="checkbox" name="checks" value="spaces" id="spaces">Double spaces
  <br>

  <input type="checkbox" name="checks" value="punctuation" id="punctuation">Punctuation outside of quotes
  <br>

  <input type="checkbox" name="checks" value="caps" id="caps">Capitilazation at beginning of sentences
  <br>

  <input type="checkbox" name="checks" value="contractions" id="contractions">Contractions
  <br>

  <input type="checkbox" name="checks" value="numbers" id="numbers">Small numbers
  <br>

  <input type="checkbox" name="checks" value="repWords" id="repWords">Repeated words
  <br>
  <br>

  <input type="submit" value="Submit">

</form>

</body>

據我所知,Logger.logs和Console.logs沒有運行,這意味着該功能沒有運行。 但是,我在HTML腳本文件中找不到有關運行控制台/記錄器日志功能的文檔。 我不確定這是否是真正的原因。 我不知道要在哪里運行該函數,以便它實際上可以影響復選框。 我擔心在身體加載時運行它實際上不會對復選框產生任何影響-它必須在表單本身中運行。 我應該在哪里調用該函數?

這是我的創建設置窗格功能:

function openSettings ()
{
  populateData ();
  initializePreferences();
  Logger.log("Data is initialized; pref 1 = " + 
  allPreferences.getProperty(propsList[0]));
  var htmlOutput = HtmlService
    .createHtmlOutputFromFile('Settings.html')
    .setWidth(300)
    .setTitle("Settings");
  DocumentApp.getUi().showSidebar(htmlOutput);
}

任何幫助表示贊賞!

您可以在加載側欄時使用類似這樣的功能

<script>
window.onload=function(){
    google.script.run
    .withSuccessHandler(function(data){
      //initialize your checkboxes here
    })
    .getPropertData();//go to server side to get access to PropertiesService data
  };

客戶端到服務器的通信

您的onSettingsOpen引用propsList ,但這是未定義的。 您應該通過給函數提供參數來傳遞函數中的數據,例如onSettingsOpen(preferences)

假設您將這些首選項存儲在某些PropertiesService中 ,當您調用Properties.getProperties()時,您將獲得一個具有鍵,值對的對象。 如果使它們與HTML輸入的“ id”屬性匹配,則可以通過將id作為鍵來在對象中查找值。

在側邊欄中:

<script>
google.script.run.withSuccessHandler(onSettingsOpen).getAllPreferences();
// @param {Object} preferences - key, value pairs from Properties.getProperties()
function onSettingsOpen(preferences)
{
  console.log("In the script");   
  const checkboxes = document.querySelectorAll('input[type="checkbox"]');
  for (let i = 0; i < checkboxes.length; ++i) {
    checkboxes[i].checked = preferences[checkboxes[i].id];
  }
}
</script>

服務器端代碼將需要適當的getAllPreferences函數:

function getAllPreferences() {
  return PropertiesService.getUserProperties().getProperties();
}

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM