Google 表格自定义边栏在提交时重新加载表单

Question

我对 Google 脚本和 jQuery 比较陌生。这么说吧，我可能知道的足以让自己陷入麻烦！我正在尝试创建自定义 UI 侧边栏以将数据输入 Google Sheet。我使用此 post 中的代码作为起点（感谢 Cooper 的分享！！）：

一切正常，但我需要在每次提交后自动重置表单，以便它准备好接受下一个条目。理想情况下，我想要一个带有按钮的确认对话框来进行新输入。我按如下方式修改了代码，但我的 "New Entry" 按钮什么也没做：

    <!DOCTYPE html>
        <html>
          <head>
            <base target="_top">
          </head>
          <body>
          <div id="data">
            <br />Text 1<input type="text" size="15" id="txt1" />
    <br />Text 2<input type="text" size="15" id="txt2" />
    <br />Text 3<input type="text" size="15" id="txt3" />
    <br />Text 4<input type="text" size="15" id="txt4" />
    <br /><input type="button" value="Log Entry" id="btn1" />
  </div>
  <div id="resp" style="display:none;">
    <h1>Your data has been received.</h1>
    <input type="button" value="New Entry" id="btn2" />
  </div>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <script>
      $(function() {
        $('#btn1').click(validate);
        $('#btn2').click(openDialog);
        $('#txt4').val('');
        $('#txt3').val('');
        $('#txt2').val('');
        $('#txt1').val('')
      });

      function setResponse(a)
      {
        if(a)
        {
          $('#data').css('display','none');
          $('#resp').css('display','block');
        }
      }

      function validate()
      {
        var txt1 = document.getElementById('txt1').value || ' ';
        var txt2 = document.getElementById('txt2').value || ' ';
        var txt3 = document.getElementById('txt3').value || ' ';
        var txt4 = document.getElementById('txt4').value || ' ';
        var a = [txt1,txt2,txt3,txt4];
        if(txt1 && txt2 && txt3 && txt4)
        {
          google.script.run
            .withSuccessHandler(setResponse)
            .getData(a);
            return true;
        }
        else
        {
          alert('All fields must be completed.');
        }
      }

      function loadTxt(from,to)
      {
          document.getElementById(to).value = document.getElementById(from).value;
      }

     console.log('My Code');

     function openDialog() {
     var html = HtmlService.createHtmlOutputFromFile("index");
     html.setTitle('Gmf Sent Msg Form'); 
     SpreadsheetApp.getUi().showSidebar(html);
    }
   </script>
  </body>
</html>

我敢肯定这很简单，我的新手脑子还不能理解，但我们非常感谢您的帮助！

Answer 1

如果你想让你的对话框工作，你需要做这样的事情：

code.gs

function openMyDialog()
{
 var html = HtmlService.createHtmlOutputFromFile("index");
 html.setTitle('Gmf Sent Msg Form'); 
 SpreadsheetApp.getUi().showSidebar(html);
}

在你的 javascript 中是这样的：

function openDialog()
{
  google.script.run.openMyDialog();

}

Google 表格自定义边栏在提交时重新加载表单

Google Sheets custom sidebar reload form on submit

html

forms

jquery

sidebar

google-sheets