Question

我正在尝试制作一个电子表格侧边栏，允许用户输入数据来创建记录，以及编辑它们。到目前为止，我了解如何创建侧边栏并显示它。我有一份可以提交价值的工作表。

我正在努力解决的是如何预先填充表格。表单实例一些记录与其他记录相关联，并且我希望有一个隐藏字段来存储并最终提交相关的id。最终，用户还应该能够编辑记录，并且我希望使用相同的表单，只填充字段并重复使用相同的提交流程。

我在这里和其他地方尝试了一些不同的东西，但似乎没什么用。

以下是侧边栏模板的HTML

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
    <link rel="stylesheet" href="https://ssl.gstatic.com/docs/script/css/add-ons.css">
    <script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.js"></script>
    <!-- The CSS package above applies Google styling to buttons and other elements. -->
    <style>
    </style>

    <script>
    // Prevent forms 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);

    $('#accountId').val(<? data.accountId ?>);

    function handleFormSubmit(formObject) {
      google.script.run.withSuccessHandler(alertSuccess).createContact(formObject);
    }

    function alertSuccess(message) {
      var div = document.getElementById('alert');
      div.innerHTML = "<p>" + message + "</p>";
      google.script.host.close();
    }
    </script>
  </head>
  <body>
    <p>Enter Contact Info</p>

    <form id="contact" onsubmit="handleFormSubmit(this)">
      Account Id: <br>
      <input type="number" name="accountId" value="0" id="accountId" /><br>
      Name:<br>
      <input type="text" name="name"/><br>
      Phone Number:<br>
      <input type="text" name="phone"/><br>
      Email:<br>
      <input type="email" name="email"/><br>
      Contact Type:<br>
      <input type="radio" name="type" value="emergency" checked> Emergency<br>
      <input type="radio" name="type" value="guardian" checked> Guardian<br>
      <input type="radio" name="type" value="other" checked> Other<br>
      <input type="submit" value="Submit" />
    </form>

    <div id="alert"></div>
  </body>
</html>

随附的.gs文件：

var AlternativeContact = ObjectModel("AlternativeContacts");

function newContact() {
  var htmlOutput = HtmlService.createTemplateFromFile("new_contact");
  var id = ACCOUNT_MANAGER.getRange("M4").getValue();
  htmlOutput.data = {accountId: id};

  UI.showSidebar(htmlOutput.evaluate());
}

function createContact(contactJSON) {
  var newContact = new AlternativeContact(contactJSON);
  newContact.save();
  return "Success!";
}

使用ObjectModel的第一行是围绕数据表创建和编写ORM。

感谢您的帮助！

Answer 1

情侣改变，似乎以一种基本的方式运作。

首先，在scriptlet中，我需要打印标签。所以用来代替。这导致该值不在渲染模板中使用。

其次，我将jQuery更改为：

$(document).ready(function () {
      $("input#accountId").val(<?= data.accountId ?>);
    });

如果有人能够回答，我很好奇为什么需要使用$（文件）.ready。在运行中没有一切吗？这是一个操作顺序吗？

Google工作表侧边栏表单 - 设置默认值

1 个答案: