gasで作成したwebアプリで、tableの値を別のHTMLファイルに渡す方法がわからない。

Question

いつもありがたいアドバイスをありがとうございます。

現在独学でwebアプリを作成しています。

その中で、スプレッドシートをDB替わりにしてwebからデータを入力したり、DBのデータをwebに表示させたりする機能のアプリを作成しているのですが、そこで一点困っていることがありましてご質問させて頂きました。

DBから呼び出したレコードをtableで表示させ、そのテーブルに編集ボタンのリンクをレコードごとに作成し、編集ボタンが押されたら別ウィンドウを表示させ、そのレコードの編集または削除ができるといいなと考えています。

function doGet(e){
  var page=e.parameter["p"];
  
  if(page == "index" || page==null){
    var htmlOutput = HtmlService.createTemplateFromFile("Index");
  }
  else if(page =="menu1"){
    return HtmlService.createHtmlOutputFromFile('Menu1');
  }
  else{
    return HtmlService.createHtmlOutputFromFile('Error');    
  }
}

上記のように疑似的にページを遷移させるような仕様にしました。その後DBからデータを取得し、下記のようなJSでデータをもとにtableを作成しました。

 //表示データ取得成功時の処理
  function day_table(result) {
  
    var json = JSON.parse(result);
    var datalength = json.length;
    
    //情報が見つかればtableにセット
    var html = "<table class='table table-striped' id='table1'>"
    html += "<thead>"
    html += "<tr>"
    html += "<th scope='col'>リンク</th>"
    html += "<th scope='col'>名前</th>"
    html += "<th scope='col'>住所</th>"
    html += "<th scope='col'>性別</th>"
    html += "<th scope='col'>誕生日</th>" 
    html += "<th scope='col'>年齢</th>"
    html += "<th scope='col'>レコード番号</th>"      
    html += "</tr>"  
    html += "</thead>"
      
    html += "<tbody>"
    for(var i=0; i<datalength; i++){        
        
      html += "<tr>"
      html += "<td><a href='https://script.google.com/macros/s/************/exec?p=menu1'  target='_blank' rel='noopener noreferrer'>編集</a></td>"
      html += "<td>" + json[i][0] + "</td>"
      html += "<td>" + json[i][1] + "</td>"
      html += "<td>" + json[i][2] + "</td>"
      //システム日付をyyyy-mm--dd形式に変換
      var hos_date = new Date(json[0][3]);
      var hos_str = hos_date.getFullYear()
      + '/' + ('0' + (hos_date.getMonth() + 1)).slice(-2)
      + '/' + ('0' + hos_date.getDate()).slice(-2)
      html += "<td>" + hos_str + "</td>"
      html += "<td>" + json[i][4] + "</td>"
      html += "<td>" + json[i][5] + "</td>"
      html += "</tr>"
    }      
    html += "</tbody>"      
    //tableをを設置する
    document.getElementById("day_table").innerHTML = html;      
  }    
} 

しかし、”編集”テキストを押したとき疑似的にページ遷移をさせるまでは良かったのですが、一番重要な編集ボタンを押されたときにそのレコードのデータを遷移先のHTMLファイル(menu1)に渡す方法がわからなくて困っています。
一意であるレコード番号の値さえ渡せればあとはDBとのやり取りだけだから先は見えてるんですが、このデータ受け渡しの1点だけが引っかかってます。
つたない説明で申し訳ありませんが、もしなにかアドバイスを頂けると助かります。
宜しくお願い致します。

なお、このサイトに意図に合わない質問でしたら取り下げますのでご指摘ください。

よろしくお願いします。

Answer 1

私も勉強始めた所なので、どうするのが正しいのかは知りませんが

みえても構わないなら
href='https://script.google.com/macros/s/************/exec?p=menu1'
にidもパラメータで追加すればいいんじゃないですか？

(追記)
セットしたidはdoGetの引数eから取得できると思うので
そのidからスプレットシートを検索し、結果をセットすればいいんじゃないでしょうか。

Google Apps ScriptからHTMLへデータを受け渡す方法

    var menu1 =  HtmlService.createTemplateFromFile('Menu1');
    menu1.AAAA='検索結果';
    return menu1.evaluate();

HTMLには「<?=AAAA ?>」を埋め込んでおく