将 URL 参数传递给 HTML 表单 Google Web App答案

【问题标题】：Pass URL Parameters to HTML Form Google Web App将 URL 参数传递给 HTML 表单 Google Web App
【发布时间】：2020-03-04 13:24:55
【问题描述】：

我已经解决了大多数与此相关的问题，但没有找到对我有帮助的解决方案（我已经一一应用了）。我有一个 HTML 表单，我通过 google 将其作为网络应用程序发布。我需要用该参数预填充一个输入框。

代码.gs

function doGet() {
return HtmlService
        .createTemplateFromFile('html')
        .evaluate();      
          }

html.html

<!DOCTYPE html>
<html>
<head>
</head>
<style>
</style>
<body>
<form>
  <h1><center>Verification</center></h1>
  Form ID:<input type="number" name="formid" id="formid" class="formid">
</form>
</body>
</html>

正如我所说，我在类似问题中尝试了许多建议，但似乎找不到一个可行的。 id 是我可以输入我的 url + ?formid= 并将其填充到输入中。我怎样才能做到这一点？

谢谢！

【问题讨论】：

标签： html google-apps-script web-applications url-parameters

【解决方案1】：

当使用url + ?formid=### 的URL 访问Web 应用程序时，您希望将### 的值放入文本框中。
- 网址类似于https://script.google.com/macros/s/###/exec?formid=###。

如果我的理解是正确的，那么这个答案呢？请认为这只是几个答案之一。

修改点：

在此修改中，我使用google.script.url.getLocation() 来检索查询参数。

修改脚本：

请修改html.html如下。

<!DOCTYPE html>
<html>
<head>
</head>
<style>
</style>
<body>
<form>
  <h1><center>Verification</center></h1>
  Form ID:<input type="number" name="formid" id="formid" class="formid">
</form>
<script>
  google.script.url.getLocation(function(location) {
    document.getElementById("formid").value = location.parameters.formid[0];
  });
</script>
</body>
</html>

通过以上修改，当你使用https://script.google.com/macros/s/###/exec?formid=12345访问Web Apps时，12345会被放到文本框中。

参考：

getLocation(function)

如果我误解了您的问题并且这不是您想要的方向，我深表歉意。

【讨论】：

完美而优雅简单！非常感谢！
@NMALM 感谢您的回复。很高兴您的问题得到解决。

【解决方案2】：

使用 Jquery：

<script>
$(function(){
  google.script.run
  .withSuccessHandler(function(v){
    $('#formid').val(v);
   })
   .getTheValueOfV();
});
</scrip>

使用常规 JavaScript

<script>
window.onload=function(){
  google.script.run
  .withSuccessHandler(function(v){
     document.getElementById('formId').value=v;
   })
  .getTheValueOfV();
};
</script>

代码.gs：

function getTheValueOfV() {
  var ss=SpreadsheetApp.getActive();
  return ss.getRangeByName("TheRangeWhereYouFindtheValueofv").getValue();
}

您可以选择将脚本放在头部或正文中。如果你使用 JQuery，你需要这样的东西。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

【讨论】：