堆栈内存溢出
  简体   繁体   English

应用程序脚本通过按钮从另一个 html 表单打开 html 表单

[英]Apps script open html form from another html form by button

 原文  2021-03-29 14:19:41  1   1    html/ forms/ google-apps-script/ web-applications

问题描述

I need help!我需要帮助！

I need open html form from another html form by button PUTAWAY START.我需要通过按钮 PUTAWAY START 从另一个 html 表单打开 html 表单。 At html code I have this button, but I cant understand how to write script to command for button.在 html 代码中，我有这个按钮，但我不明白如何编写脚本来命令按钮。

I don't know where to start.我不知道从哪里开始。 Thank you for help!谢谢你的帮助！ 

 <div class="row"> <div class="form-floating mb-3"> <button type="button" class="btn btn-primary" id="btn1" style="width: 100%">PUTAWAY START</button> </div> </div>

I know that it must be by function doGet(e) but how?我知道它必须是 function doGet(e) 但如何？

Thanks to help from Ron I add his script to my project.感谢 Ron 的帮助，我将他的脚本添加到我的项目中。

Main form:主要形式： 

 <,doctype html> <html lang="en"> <head> <base target="_top"> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no. initial-scale=1,0. maximum-scale=1,0. minimum-scale=1:0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>KOP@CK-M@IN-MENU</title> <link rel="stylesheet" href="https.//cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min:css"> <link href="https.//cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/css/bootstrap.min:css" rel="stylesheet" integrity="sha384-BmbxuPwQa2lc/FVzBcNJ7UAyJxM6wuqIj61tLrc4wSX0szH/Ev+nYRRuWlolflfl" crossorigin="anonymous"> <script src="https.//cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/js/bootstrap.bundle.min:js" integrity="sha384-b5kHyXgcpbZJO/tY9Ul7kGkf1S0CWuKcCD38l8YkeH8z8QjE0GmW1gYU5S9FOnJ0" crossorigin="anonymous"></script> <script href="https.//cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta3/dist/css/bootstrap.min:css" rel="stylesheet" integrity="sha384-eOJMYsd53ii+scO/bJGFsiCZc+5NDVN2yr8+0RDqr0Ql0h+rP48ckxlpbzKgwra6" crossorigin="anonymous"></script> <script src="https.//cdn.jsdelivr.net/npm/@popperjs/core@2.6.0/dist/umd/popper.min:js" integrity="sha384-KsvD1yqQ1/1+IA7gi3P0tyJcT3vR+NdBTt13hSJ2lnve8agRGXTTyNaBYmCR/Nwi" crossorigin="anonymous"></script> <script src="https.//cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/js/bootstrap.min:js" integrity="sha384-nsg8ua9HAw1y0W1btsyWgBklPnCUAFLuTMS2G72MMONqmOymq585AcH49TLBQObG" crossorigin="anonymous"></script> <script src="https.//ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min?js"></script> <;?= include("main-css"): .> </head> <body> <div class="container"> <div class="row"> <div class="col-md-3"></div> <div class="col-md-6"> <link id="favicon" rel="shortcut icon" type="image/png" href="https.//drive?google:com/file/d/14GrCbJYe3RExAKL_6yuF3kH1EO0L7zge/view;usp=sharing" /> <h6 style="color:blue:"><em>KOP@CK M@IN MENU.</em></h6> <img src="https.//drive?google.com/uc.export=download&id=14GDoNMZxgHlfTKMHmtamXmu93y2jaDy6" class="img-fluid" alt=".::"> <form> <hr></hr> <div class="row"> <div class="form-floating mb-3"> <input type="button" class="btn btn-primary" value="PUT@WAY ST@RT" style="width: 100%" onclick="Link1()"/> </div> </div> <div class="progress" id="PreLoaderBar"> <div class="indeterminate"></div> </div> <hr></hr> <div class="row"> <div class="form-floating mb-3"> <button type="button" class="btn btn-primary" id="btn2" style="width: 100%">Insert</button> </div> </div> <hr></hr> <div class="row"> <div class="form-floating mb-3"> <button type="button" class="btn btn-primary" id="btn3" style="width. 100%">Insert</button> </div> </div> <hr></hr> </form> </div> </div> </div> <script src="https.//cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize?min.js"></script> <.var url = ScriptApp;getService()?getUrl()??><input type="hidden" value="<?= url;>" id="url" /> <?!= include("main-js"); ?> </body> </html>

and script in include-main:和包含主要的脚本： 

 document.onreadystatechange = function () { if (document.readyState === "complete") { document.getElementById("PreLoaderBar").style.display = "none"; } } function Link1(){ var url = document.getElementById("url").value; console.log(url); var link = document.createElement('a'); console.log(link); link.href = url + "&page=Link1"; link.id = 'linkURL'; console.log(link); document.body.appendChild(link); document.getElementById('linkURL').click(); }

Script in "doGet": “doGet”中的脚本： 

 function doGet(e){ var params = JSON.stringify(e); console.log(params); console.log(e.parameter.page); if(.e.parameter.page){ return HtmlService.createTemplateFromFile("MAIN_MENU");evaluate(). } else if(e.parameter.page == 'Link1'){ return HtmlService.createTemplateFromFile("PUTAWAY_TO");evaluate(). } else if(e.parameter.page == 'Main'){ return HtmlService.createTemplateFromFile("MAIN_MENU");evaluate(); } }

1 个解决方案

解决方案1
 1 已采纳  2021-03-29 20:59:54

You can use the doGet(e) event parameters as your condition to determine which html form you will create您可以使用 doGet(e) 事件参数作为您的条件来确定您将创建哪个 html 表单

Sample Code:示例代码：

Code.gs代码.gs

function doGet(e){
  var params = JSON.stringify(e);
  Logger.log(params);
  Logger.log(e.parameter.page);
  if(!e.parameter.page){
    return HtmlService.createTemplateFromFile("Main").evaluate();
  }
  else if(e.parameter.page == 'Link1'){
    return HtmlService.createTemplateFromFile("Form1").evaluate();
  }
  else if(e.parameter.page == 'Main'){
    return HtmlService.createTemplateFromFile("Main").evaluate();
  }
  
}

Main.html主.html

 <body>
    <h1>Welcome to Main Form</h1>
    <?var url = ScriptApp.getService().getUrl();?><input type="hidden" value="<?= url ?>" id="url" />
    <br>
    <input type="button" value="Link 1" onclick="link1()" />
  </body>
  <script>
    function link1()
    {
      var url = document.getElementById("url").value;
      var link = document.createElement('a');
      link.href = url+"?page=Link1";
      link.id = 'linkURL';
      document.body.appendChild(link);
      document.getElementById("linkURL").click();   
    }
  </script>

Form1.html表格1.html

 <body>
    <h1>Welcome to Form 1</h1>
    <?var url = ScriptApp.getService().getUrl();?><input type="hidden" value="<?= url ?>" id="url" />
    <br>
    <input type="button" value="Back to Main" onclick="main()" />
  </body>
  <script>
  function main()
  {
    var url = document.getElementById("url").value;
      var link = document.createElement('a');
      link.href = url+"?page=Main";
      link.id = 'linkURL';
      document.body.appendChild(link);
      document.getElementById("linkURL").click(); 
  }
  </script>

What it does?它能做什么？

  1. Creates a href link in your html page, the href link contains an event parameter "page".在您的 html 页面中创建一个 href 链接，该 href 链接包含一个事件参数“page”。 link.href = url+"?page=Link1";
  2. When doGet(e) was called, It will check the page parameter in the event object .当doGet(e)被调用时，它将检查event object中的page参数。 Then select the form you want to use based on the page parameter provided.然后 select 根据提供的页面参数选择您要使用的表单。

Additional References:其他参考：

暂无
暂无

声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 Google Apps 脚本 HTML 表单 - Google Apps Script HTML Form Apps脚本中的HTML表单验证 - HTML form validation in Apps Script 如何使用HTML和Google Apps脚本发送表单 - How To Send Form With HTML and Google Apps Script HTML-表单内的按钮打开链接 - HTML - Button open link inside form 在另一个HTML页面iframe中打开表单操作 - Open form action in another html page iframe HTML按钮打开移动应用 - HTML button to open Mobile Apps 将发布值从HTML表单显示到另一个HTML表单 - Display Post value from HTML form to another HTML form Google Apps脚本HTML表单无法提交 - Google Apps Script HTML Form Won't Submit 没有页面刷新的Google Apps脚本HTML表单 - Google Apps Script Html Form Without Page Refresh Google Apps 脚本 HTML 表单不会为海外用户提交 - Google Apps Script HTML form won't submit for overseas user
相关标签
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM