###前提・実現したいこと
GASでVBAでいうとユーザーフォームのようなものを作るために、UserForm.htmlを作成し、そこにテキストボックスなどを配置し、その値をGAS側で受け取りたいのですが方法がわかりません。
また、GAS側の値をhtml側で受け取りたいのですがそれもよくわかりません。どのようにすればよいのでしょうか？そもそも可能なのでしょうか？
###発生している問題・エラーメッセージ
値の受け渡し方法がわからない。
###該当のソースコード
GAS側(コード.gs)
function main(){
var app=SpreadsheetApp;
var html = HtmlService.createHtmlOutputFromFile('UserForm');
app.getActiveSpreadsheet().show(html);
}
function adasu(){
var a = "aaa";
return a;
}

UserForm.html側

<!DOCTYPE html> <html lang="ja"> <head> <base target="_top"> </head> <body> <script type="text/javascript" > var d=//ここでadasu()の値を受け取りたい for(var i=0;i<3;i++){ document.writeln('<input type="text" value='+ d +' name="pra'+ i +'"/>');//このテキストボックス内に入力された値をGAS側で受け取りたい。

}
</script>

</body> </html>

###試したこと

<??>,<?=?>を使えばよいとの記述を見たのですが、使い方が間違っているのか、そのまま表示されてしまいます。使い方も教えていただけると幸いです

###補足情報(言語/FW/ツール等のバージョンなど)
より詳細な情報

行動規範の内容に同意します

回答2件

ベストアンサー

強引なやり方かもしれませんが実現できたので回答します。
まずソースコードは以下のようになりました。

コード.gs

function main(){
  var app = SpreadsheetApp;
  var html = HtmlService.createHtmlOutputFromFile('UserForm');
  var content = html.getContent().replace(/%adasu\(\)%/, '"' + adasu() + '"');
  app.getActiveSpreadsheet().show(HtmlService.createHtmlOutput(content));
}
function adasu(){
  var a = "aaa";
  return a;
}
function recieveFromHtml(values) {
  for(var i = 0; i < values.length; i++) {
    Logger.log(values[i]);
  }
  Browser.msgBox("値が送信できました。\nログを確認してください。");
}

UserForm.html

<!DOCTYPE html>
<html lang="ja">
<head>
  <base target="_top">
</head>
<body>
  <button type="submit" onclick="sendGoogleAppsScript()">送信</button>
  <br>

<script type="text/javascript" >
  var d = %adasu()%;    //ここでadasu()の値を受け取りたい
  for(var i=0;i<3;i++){
    document.writeln('<input type="text" value='+ d +' name="pra'+ i +'"/>');//このテキストボックス内に入力された値をGAS側で受け取りたい。
  }
  
  function sendGoogleAppsScript() {    
    var values = [];
    for (var i = 0; i < 3; i++) {
      var element = document.getElementsByName("pra" + i)[0];
      values.push(element.value);
    }
    google.script.run.recieveFromHtml(values);
  }
</script>
</body>
</html>

GAS ⇒ HTML の値受け渡し

UserForm.html を取得しHTMLテキストを抜き出す
HTMLテキスト内の変数代入部分（%adasu()%）を function adasu() の値で置換
置換後のHTMLテキストを HtmlService で再生成

HTML ⇒ GAS の値受け渡し

GAS側でHTMLから値を受け取る用の function recieveFromHtml() を定義
値を渡すためのトリガが必要なためボタンを追加
ボタンから起動する function sendGoogleAppsScript() を定義
HTMLから受け渡したい値を取得
google.script.run コマンドで recieveFromHtml() を呼び出し、渡したい値を引数に指定

補足

recieveFromHtml() 内で Browser.msgBox() を呼び出しているのは、
表示されている UserForm.html を閉じる役割も兼ねています。
（ボタン押下後に閉じる方法が分からないので…）

投稿2017/08/06 06:25

rokuni

総合スコア174

nono1234

2017/08/07 04:42 編集

ありがとうございます！！VBAはやったことがあるのですがGASとHTMLは最近勉強しはじめたばかりで、いろいろ探してもこれというものがなくて本当に助かりました！一つ質問なのですが、adasu()を％で囲むのはなぜでしょうか？念のためコード側とUserForm側の％adasu()％の％を消してやってみたのですが動きました。adasuをfunctionではなく文字列とみるだけなら//で囲んで正規表現にするだけでは不十分なのででしょうか？おそらく何らかのエラーが発生するのを防ぐためだとは思うのですがよくわかりません。ご教授いただけると幸いです。

rokuni

2017/08/07 05:12

nono1234 さんのおっしゃられる通り、% は無くても問題ないです。 "adasu()" ではなく "%adasu()%" としたのは、「この文字列を置換する」ことを明確にしたかったことと、意図しない置換を防ぐためです。たとえば別の箇所で "new_adasu()" という関数を呼び出していたら、意図しない置換が発生してしまいます。（var a = new_adasu(); ⇒ var a = new_"aaa"; となってしまう） % で囲むのは必須ではないため、やりやすい文字列をHTMLに埋め込めば大丈夫だと思います。

KASHIF

2023/09/14 14:30

I am glad you take pride in what you write. This makes you stand way out from many other writers that push poorly written content. <a href="high intence pressure match">Good quality match</a>

行動規範の内容に同意します