同じページに設置された各フォームを送信するときにそれぞれ異なるページを表示します。そのため、doPost()内で各フォームの処理を分離したかったのですが、質問は、フォームを区別するために使用される値を取得する方法がわからないということでした。 次の3つの方法を試しましたが、この試みは残念ながら失敗しました。
- (1)button要素(type属性button)のidをクリックイベントから受け取ります。→何も起こりません。
html
1<button type='button' id='form1' class='button'>button</button> 2<button type='button' id='form2' class='button'>button</button>
js
1const button = document.querySelectorAll('.button'); 2for(let i=0;i<button.length;i=i+1){button[i].addEventListener('click',function(){buttonF(this.id)});} 3function buttonF(x){google.script.run.buttonClick(x);}
gs
1function buttonClick(x){ 2let template; 3switch (x){ 4 case 'form1': template = HtmlService.createTemplateFromFile('form1'); 5 break; 6 case 'form2': template = HtmlService.createTemplateFromFile('form2'); 7 break; 8} 9return template.evaluate(); 10}
- (2)button要素(type属性submit)のidをクリックイベントから受け取ります。→「スクリプトが完了しましたが、何も返されませんでした」
- (3)input要素(type属性hidden)の値をdoPost()から受け取ります。→ウェブブラウザが埋め込みページの表示をブロックします。新しいウィンドウで開いても元のページが表示されるだけです。
html
1<form action='...' method='post'> 2 <input type='hidden' name='form' value='form1'> 3 <button type="submit" class='submit'>submit</button> 4</form> 5<form action='...' method='post'> 6 <input type='hidden' name='form' value='form2'> 7 <button type='submit' class='submit'>submit</button> 8</form>
js
1const submit = document.querySelectorAll('.submit'); 2for(let i=0;i<submit.length;i=i+1){submit[i].addEventListener('click', function(){submitF(this.id)});} 3function submitF(x){google.script.run.submitClick(x);}
gs
1 2function submitClick(x){ 3let template; 4switch (x){ 5 case 'form1': template = HtmlService.createTemplateFromFile('form1'); break; 6 case 'form2': template = HtmlService.createTemplateFromFile('form2'); break; 7} 8return template.evaluate(); 9}//(2) 10 11function doPost(e){ 12const form= e.parameter.form; 13let template; 14switch (form){ 15 case 'form1': template = HtmlService.createTemplateFromFile('form1'); break; 16 case 'form2': template = HtmlService.createTemplateFromFile('form2'); break; 17} 18return template.evaluate(); 19}//(3)
回答1件
あなたの回答
tips
プレビュー