Javascript 谷歌应用程序脚本HTML表单赢得'；不要屈服_Javascript_Html_Google Apps Script

Javascript 谷歌应用程序脚本HTML表单赢得'；不要屈服

javascript html google-apps-script

Javascript 谷歌应用程序脚本HTML表单赢得'；不要屈服,javascript,html,google-apps-script,Javascript,Html,Google Apps Script,首先，我将向您提供代码，并简要解释我试图实现的目标代码.gs function onOpen() { SpreadsheetApp.getUi() // Or DocumentApp or FormApp. .createMenu("Custom Menu") .addItem("Show sidebar", "showSidebar") .addToUi(); } function doGet() { return HtmlService.cre

首先，我将向您提供代码，并简要解释我试图实现的目标

代码.gs

function onOpen() {
  SpreadsheetApp.getUi() // Or DocumentApp or FormApp.
      .createMenu("Custom Menu")
      .addItem("Show sidebar", "showSidebar")
      .addToUi();
}

function doGet() {
  return HtmlService.createHtmlOutputFromFile("entry");
}

function showSidebar() {
  var html = HtmlService.createHtmlOutputFromFile("entry")
      .setTitle("My custom sidebar")
      .setWidth(300);
  SpreadsheetApp.getUi() // Or DocumentApp or FormApp.
      .showSidebar(html);
}

function EnterData(fobject) {
  var ss = SpreadsheetApp.getActiveSpreadsheet();
  var sheet = ss.getSheetByName("Sheet1");
  sheet.activate();

    ss.toast("Something Happened");

  var range = sheet.getRange(1, 1);
  range.setValue("It worked");
}

function ProgramSuccess() {
  var ss = SpreadsheetApp.getActiveSpreadsheet();
  ss.toast("Program Run Complete");
}

entry.html

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
    <script>
      // Prevent form from submitting
      function preventFormSubmit() {
        var forms = document.querySelectorAll('form');
        for (var i = 0; i < forms.length; i++) {
          forms[i].addEventListener('submit', function(event) {
            event.preventDefault();
          });
        }
      }
      window.addEventListener('load', preventFormSubmit);

      function FormSubmit(formObject) {
        google.script.run.withSucessHandler(FormSuccess).EnterData(formObject);
      }
      function FormSuccess() {
        google.script.run.ProgramSuccess;
        google.script.host.close();
      }
    </script>
  </head>

  <body>
    <form id="entryForm" onsubmit="FormSubmit(this)">
      Name:<br>
      <input type="text" name="name">
      <br>
      Client Name:<br>
      <input type="text" name="clientname">
      <br><br>
      <input type="submit" value="Submit">
      <input type="reset">
    </form>
  </body>
</html>

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
    <script>
      // Prevent form from submitting
      function preventFormSubmit() {
        var forms = document.querySelectorAll('form');
        for (var i = 0; i < forms.length; i++) {
          forms[i].addEventListener('submit', function(event) {
            event.preventDefault();
          });
        }
      }
      window.addEventListener('load', preventFormSubmit);

      function FormSubmit() {
        google.script.run.withSucessHandler(FormSuccess).EnterData(document.getElementById("entryForm"));
      }
      function FormSuccess() {
        google.script.run.ProgramSuccess;
        google.script.host.close();
      }
    </script>
  </head>

  <body>
    <form id="entryForm">
      Name:<br>
      <input type="text" name="name">
      <br>
      Client Name:<br>
      <input type="text" name="clientname">
      <br><br>
      <input type="submit" value="Submit" onclick="FormSubmit()">
      <input type="reset">
    </form>
  </body>
</html>


//阻止表单提交
函数preventFormSubmit（）{
var forms=document.queryselectoral（'form'）；
对于（var i=0；i


客户名称：

这个程序的目的是在google工作表中打开一个侧栏，显示一个带有表单（标签）的html页面。然后，当您在html侧栏中单击submit时，它应该运行code.gs中的

EnterData

函数。我的问题是这个函数没有运行，当我单击submit按钮时什么也没有发生

在此方面的任何帮助都将不胜感激。

尝试以下方法：

entry.html

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
    <script>
      // Prevent form from submitting
      function preventFormSubmit() {
        var forms = document.querySelectorAll('form');
        for (var i = 0; i < forms.length; i++) {
          forms[i].addEventListener('submit', function(event) {
            event.preventDefault();
          });
        }
      }
      window.addEventListener('load', preventFormSubmit);

      function FormSubmit(formObject) {
        google.script.run.withSucessHandler(FormSuccess).EnterData(formObject);
      }
      function FormSuccess() {
        google.script.run.ProgramSuccess;
        google.script.host.close();
      }
    </script>
  </head>

  <body>
    <form id="entryForm" onsubmit="FormSubmit(this)">
      Name:<br>
      <input type="text" name="name">
      <br>
      Client Name:<br>
      <input type="text" name="clientname">
      <br><br>
      <input type="submit" value="Submit">
      <input type="reset">
    </form>
  </body>
</html>

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
    <script>
      // Prevent form from submitting
      function preventFormSubmit() {
        var forms = document.querySelectorAll('form');
        for (var i = 0; i < forms.length; i++) {
          forms[i].addEventListener('submit', function(event) {
            event.preventDefault();
          });
        }
      }
      window.addEventListener('load', preventFormSubmit);

      function FormSubmit() {
        google.script.run.withSucessHandler(FormSuccess).EnterData(document.getElementById("entryForm"));
      }
      function FormSuccess() {
        google.script.run.ProgramSuccess;
        google.script.host.close();
      }
    </script>
  </head>

  <body>
    <form id="entryForm">
      Name:<br>
      <input type="text" name="name">
      <br>
      Client Name:<br>
      <input type="text" name="clientname">
      <br><br>
      <input type="submit" value="Submit" onclick="FormSubmit()">
      <input type="reset">
    </form>
  </body>
</html>


//阻止表单提交
函数preventFormSubmit（）{
var forms=document.queryselectoral（'form'）；
对于（var i=0；i


客户名称：

另外，我不明白为什么要将“entryForm”对象传递给EnterData函数，因为您似乎没有使用它。

我计划使用用户在表单中输入的值，如：

range.setValue（foobject.name）我添加了你的编辑，但似乎我仍然无法让HTML调用服务器端函数。你在entry.HTML文件中犯了拼写错误。它应该是google.script.run.withSuccessHandler
，而不是google.script.run.withSuccessHandler
。哇！非常感谢。我想你可以把你的代码读10遍，但还是找不到最简单的，如果一开始就把所有人都弄错了的话。下次处理任何使用HTML的用例时，请尝试在浏览器中使用Inspect元素选项，并在控制台中查找错误。99%的时候你可以自己解决错误。谢谢你的建议。我还不熟悉使用HTML，所以我一定会继续尝试