質問編集履歴
11
一文目を追加
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -1,3 +1,6 @@
|
|
|
1
|
+
複数のフォームがあり、それぞれの送信後に異なるページを表示したい。
|
|
2
|
+
|
|
3
|
+
---
|
|
1
4
|
どのフォームが送信されたかを識別する方法が不明。3つの異なるアプローチは期待通りに動作しませんでした。
|
|
2
5
|
1. button要素(type属性button)のidをクリックイベントから受け取ります: 何も起こりません。
|
|
3
6
|
2. button要素(type属性submit)のidをクリックイベントから受け取ります : 「スクリプトが完了しましたが、何も返されませんでした」
|
10
書式の改善
title
CHANGED
|
@@ -1,1 +1,1 @@
|
|
|
1
|
-
|
|
1
|
+
フォームの送信に応じたページ表示の実現方法
|
body
CHANGED
|
@@ -1,63 +1,59 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
function
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
case 'form2': template = HtmlService.createTemplateFromFile('form2'); break;
|
|
60
|
-
}
|
|
61
|
-
return template.evaluate();
|
|
62
|
-
}//(3)
|
|
1
|
+
どのフォームが送信されたかを識別する方法が不明。3つの異なるアプローチは期待通りに動作しませんでした。
|
|
2
|
+
1. button要素(type属性button)のidをクリックイベントから受け取ります: 何も起こりません。
|
|
3
|
+
2. button要素(type属性submit)のidをクリックイベントから受け取ります : 「スクリプトが完了しましたが、何も返されませんでした」
|
|
4
|
+
3. input要素(type属性hidden)の値をdoPost()から受け取ります: ウェブブラウザが埋め込みページの表示をブロックします。新しいウィンドウで開いても元のページが表示されるだけです。
|
|
5
|
+
```js
|
|
6
|
+
const buttons = document.querySelectorAll('.button');
|
|
7
|
+
//querySelectorAll('.submit')
|
|
8
|
+
for (let i = 0; i < buttons.length; i++) {
|
|
9
|
+
buttons[i].addEventListener('click', function() {
|
|
10
|
+
handleButtonClick(this.id);
|
|
11
|
+
});
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
function handleButtonClick(buttonId) {
|
|
15
|
+
google.script.run.buttonClick(buttonId);
|
|
16
|
+
}
|
|
17
|
+
```
|
|
18
|
+
```gs
|
|
19
|
+
function buttonClick(buttonId) {
|
|
20
|
+
let template;
|
|
21
|
+
switch (buttonId) {
|
|
22
|
+
case 'form1':
|
|
23
|
+
template = HtmlService.createTemplateFromFile('PageForm1');
|
|
24
|
+
break;
|
|
25
|
+
case 'form2':
|
|
26
|
+
template = HtmlService.createTemplateFromFile('PageForm2');
|
|
27
|
+
break;
|
|
28
|
+
}
|
|
29
|
+
return template.evaluate();
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
function doPost(e) {
|
|
33
|
+
const form = e.parameter.form;
|
|
34
|
+
let template;
|
|
35
|
+
switch (form) {
|
|
36
|
+
case 'form1':
|
|
37
|
+
template = HtmlService.createTemplateFromFile('form1');
|
|
38
|
+
break;
|
|
39
|
+
case 'form2':
|
|
40
|
+
template = HtmlService.createTemplateFromFile('form2');
|
|
41
|
+
break;
|
|
42
|
+
}
|
|
43
|
+
return template.evaluate();
|
|
44
|
+
}
|
|
45
|
+
```
|
|
46
|
+
```html
|
|
47
|
+
<button type = 'button' id = 'form1' class = 'button'>button</button>
|
|
48
|
+
<button type = 'button' id = 'form2' class = 'button'>button</button>
|
|
49
|
+
|
|
50
|
+
<form action = '...' method = 'post'>
|
|
51
|
+
<input type = 'hidden' name = 'form' value = 'form1'>
|
|
52
|
+
<button type = "submit" class = 'submit'>submit</button>
|
|
53
|
+
</form>
|
|
54
|
+
|
|
55
|
+
<form action = '...' method = 'post'>
|
|
56
|
+
<input type = 'hidden' name = 'form' value = 'form2'>
|
|
57
|
+
<button type = 'submit' class = 'submit'>submit</button>
|
|
58
|
+
</form>
|
|
63
59
|
```
|
9
全体の修正: コード: (2),(3)
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -21,4 +21,43 @@
|
|
|
21
21
|
}
|
|
22
22
|
return template.evaluate();
|
|
23
23
|
}
|
|
24
|
+
```
|
|
25
|
+
|
|
26
|
+
- (2)button要素(type属性submit)のidをクリックイベントから受け取ります。→「スクリプトが完了しましたが、何も返されませんでした」
|
|
27
|
+
- (3)input要素(type属性hidden)の値をdoPost()から受け取ります。→ウェブブラウザが埋め込みページの表示をブロックします。新しいウィンドウで開いても元のページが表示されるだけです。
|
|
28
|
+
```html
|
|
29
|
+
<form action='...' method='post'>
|
|
30
|
+
<input type='hidden' name='form' value='form1'>
|
|
31
|
+
<button type="submit" class='submit'>submit</button>
|
|
32
|
+
</form>
|
|
33
|
+
<form action='...' method='post'>
|
|
34
|
+
<input type='hidden' name='form' value='form2'>
|
|
35
|
+
<button type='submit' class='submit'>submit</button>
|
|
36
|
+
</form>
|
|
37
|
+
```
|
|
38
|
+
```js
|
|
39
|
+
const submit = document.querySelectorAll('.submit');
|
|
40
|
+
for(let i=0;i<submit.length;i=i+1){submit[i].addEventListener('click', function(){submitF(this.id)});}
|
|
41
|
+
function submitF(x){google.script.run.submitClick(x);}
|
|
42
|
+
```
|
|
43
|
+
```gs
|
|
44
|
+
|
|
45
|
+
function submitClick(x){
|
|
46
|
+
let template;
|
|
47
|
+
switch (x){
|
|
48
|
+
case 'form1': template = HtmlService.createTemplateFromFile('form1'); break;
|
|
49
|
+
case 'form2': template = HtmlService.createTemplateFromFile('form2'); break;
|
|
50
|
+
}
|
|
51
|
+
return template.evaluate();
|
|
52
|
+
}//(2)
|
|
53
|
+
|
|
54
|
+
function doPost(e){
|
|
55
|
+
const form= e.parameter.form;
|
|
56
|
+
let template;
|
|
57
|
+
switch (form){
|
|
58
|
+
case 'form1': template = HtmlService.createTemplateFromFile('form1'); break;
|
|
59
|
+
case 'form2': template = HtmlService.createTemplateFromFile('form2'); break;
|
|
60
|
+
}
|
|
61
|
+
return template.evaluate();
|
|
62
|
+
}//(3)
|
|
24
63
|
```
|
8
全体の修正: コード: (1)
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -1,1 +1,24 @@
|
|
|
1
|
-
同じページに設置された各フォームを送信するときにそれぞれ異なるページを表示します。そのため、doPost（）内で各フォームの処理を分離したかったのですが、質問は、フォームを区別するために使用される値を取得する方法がわからないということでした。 次の3つの方法を試しましたが、この試みは残念ながら失敗しました。
|
|
1
|
+
同じページに設置された各フォームを送信するときにそれぞれ異なるページを表示します。そのため、doPost（）内で各フォームの処理を分離したかったのですが、質問は、フォームを区別するために使用される値を取得する方法がわからないということでした。 次の3つの方法を試しましたが、この試みは残念ながら失敗しました。
|
|
2
|
+
|
|
3
|
+
- (1)button要素(type属性button)のidをクリックイベントから受け取ります。→何も起こりません。
|
|
4
|
+
```html
|
|
5
|
+
<button type='button' id='form1' class='button'>button</button>
|
|
6
|
+
<button type='button' id='form2' class='button'>button</button>
|
|
7
|
+
```
|
|
8
|
+
```js
|
|
9
|
+
const button = document.querySelectorAll('.button');
|
|
10
|
+
for(let i=0;i<button.length;i=i+1){button[i].addEventListener('click',function(){buttonF(this.id)});}
|
|
11
|
+
function buttonF(x){google.script.run.buttonClick(x);}
|
|
12
|
+
```
|
|
13
|
+
```gs
|
|
14
|
+
function buttonClick(x){
|
|
15
|
+
let template;
|
|
16
|
+
switch (x){
|
|
17
|
+
case 'form1': template = HtmlService.createTemplateFromFile('form1');
|
|
18
|
+
break;
|
|
19
|
+
case 'form2': template = HtmlService.createTemplateFromFile('form2');
|
|
20
|
+
break;
|
|
21
|
+
}
|
|
22
|
+
return template.evaluate();
|
|
23
|
+
}
|
|
24
|
+
```
|
7
全体の修正: 説明
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -1,87 +1,1 @@
|
|
|
1
|
-
## Code
|
|
2
|
-
```html
|
|
3
|
-
<form action="URL" method="post" name ="form_1" id = "form_1"><input type="submit"></form>
|
|
4
|
-
<form action="URL" method="post" name ="form_2" id = "form_2"><input type="submit"></form>
|
|
5
|
-
```
|
|
6
|
-
```script
|
|
7
|
-
function doGet(){return HtmlService.createTemplateFromFile("index").evaluate();}
|
|
8
|
-
```
|
|
9
|
-
## Error
|
|
10
|
-
### name
|
|
11
|
-
ReferenceError: name is not defined
|
|
12
|
-
```script
|
|
13
|
-
function doPost() {
|
|
14
|
-
if(name === form_1){return HtmlService.createTemplateFromFile("form_1").evaluate();}
|
|
15
|
-
else{return HtmlService.createTemplateFromFile("form_2").evaluate();}
|
|
16
|
-
}
|
|
17
|
-
```
|
|
18
|
-
### id
|
|
19
|
-
ReferenceError: id is not defined
|
|
20
|
-
```script
|
|
21
|
-
function doPost() {
|
|
22
|
-
if(id === form_2){return HtmlService.createTemplateFromFile("form_1").evaluate();}
|
|
23
|
-
else{return HtmlService.createTemplateFromFile("form_2").evaluate();}
|
|
24
|
-
}
|
|
25
|
-
```
|
|
26
|
-
### onclick
|
|
27
|
-
スクリプトが完了しましたが、何も返されませんでした。
|
|
28
|
-
```html
|
|
29
|
-
<input type="submit" onclick = <?!= form_1(); ?>>
|
|
30
|
-
<input type="submit" onclick = <?!= form_2(); ?>>
|
|
31
|
-
```
|
|
32
|
-
```script
|
|
33
|
-
function form_1(){return HtmlService.createTemplateFromFile("form_1").evaluate();}
|
|
34
|
-
function form_2(){return HtmlService.createTemplateFromFile("form_2").evaluate();}
|
|
35
|
-
```
|
|
36
|
-
### .id & id
|
|
37
|
-
ReferenceError: id_name is not defined
|
|
38
|
-
```html
|
|
39
|
-
<input type="submit" onclick= <? forms(this); ?>>
|
|
40
|
-
<input type="submit" onclick= <? forms(this); ?>>
|
|
41
|
-
```
|
|
42
|
-
```script
|
|
43
|
-
function forms(x){const id_name = x.id; return id_name}
|
|
44
|
-
function doPost(){
|
|
45
|
-
if(id_name === form_1){HtmlService.createTemplateFromFile("form_1").evaluate();}
|
|
46
|
-
else{HtmlService.createTemplateFromFile("form_2").evaluate();}
|
|
47
|
-
}
|
|
48
|
-
```
|
|
49
|
-
##編集
|
|
50
|
-
###No.1: html構造の再検討
|
|
51
|
-
既知の要素取得方法に基づいて、さまざまな要素取得方法を検証するために使いやすい構成を再検討しました。
|
|
52
|
-
```html
|
|
53
|
-
<body>
|
|
54
|
-
<div>
|
|
55
|
-
<p>Paragraph</p>
|
|
56
|
-
|
|
1
|
+
同じページに設置された各フォームを送信するときにそれぞれ異なるページを表示します。そのため、doPost（）内で各フォームの処理を分離したかったのですが、質問は、フォームを区別するために使用される値を取得する方法がわからないということでした。 次の3つの方法を試しましたが、この試みは残念ながら失敗しました。
|
|
57
|
-
<form action="URL" method="post"><input type="text"><input type="submit"></form>
|
|
58
|
-
</div>
|
|
59
|
-
</body>
|
|
60
|
-
```
|
|
61
|
-
Div
|
|
62
|
-
├Paragraph
|
|
63
|
-
├Form
|
|
64
|
-
│├Input(text)
|
|
65
|
-
│└Input(button)
|
|
66
|
-
└Form
|
|
67
|
-
□├Input(text)
|
|
68
|
-
□└Input(button)
|
|
69
|
-
###No.2: 期待した動作を行うかどうかテストが行われました。
|
|
70
|
-
- Element.children
|
|
71
|
-
- document.getElementsByClassName()
|
|
72
|
-
###No.3: これらの関数は、前提として利用されることがあります。
|
|
73
|
-
```script
|
|
74
|
-
function getRf(shname, row, column){
|
|
75
|
-
const Gs = SpreadsheetApp.getActiveSpreadsheet();
|
|
76
|
-
const Gss = Gs.getSheetByName(sheetname)
|
|
77
|
-
const reRan = Gss.getRange(row,column);
|
|
78
|
-
return reRan;
|
|
79
|
-
}//紐づいたシートが使用されます。
|
|
80
|
-
function setVf(shname,row,column,test){
|
|
81
|
-
getRf(shname,row,column).setValue(test);
|
|
82
|
-
}
|
|
83
|
-
function getVf(shname,row,column){
|
|
84
|
-
const reVal = getRf(shname,row,column).getValue();
|
|
85
|
-
return reVal
|
|
86
|
-
}
|
|
87
|
-
```
|
6
編集> No.3: これらの関数は、前提として利用されることがあります。
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -68,4 +68,20 @@
|
|
|
68
68
|
□└Input(button)
|
|
69
69
|
###No.2: 期待した動作を行うかどうかテストが行われました。
|
|
70
70
|
- Element.children
|
|
71
|
-
- document.getElementsByClassName()
|
|
71
|
+
- document.getElementsByClassName()
|
|
72
|
+
###No.3: これらの関数は、前提として利用されることがあります。
|
|
73
|
+
```script
|
|
74
|
+
function getRf(shname, row, column){
|
|
75
|
+
const Gs = SpreadsheetApp.getActiveSpreadsheet();
|
|
76
|
+
const Gss = Gs.getSheetByName(sheetname)
|
|
77
|
+
const reRan = Gss.getRange(row,column);
|
|
78
|
+
return reRan;
|
|
79
|
+
}//紐づいたシートが使用されます。
|
|
80
|
+
function setVf(shname,row,column,test){
|
|
81
|
+
getRf(shname,row,column).setValue(test);
|
|
82
|
+
}
|
|
83
|
+
function getVf(shname,row,column){
|
|
84
|
+
const reVal = getRf(shname,row,column).getValue();
|
|
85
|
+
return reVal
|
|
86
|
+
}
|
|
87
|
+
```
|
5
編集> No.2: 期待した動作を行うかどうかテストが行われました。
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -65,4 +65,7 @@
|
|
|
65
65
|
│└Input(button)
|
|
66
66
|
└Form
|
|
67
67
|
□├Input(text)
|
|
68
|
-
□└Input(button)
|
|
68
|
+
□└Input(button)
|
|
69
|
+
###No.2: 期待した動作を行うかどうかテストが行われました。
|
|
70
|
+
- Element.children
|
|
71
|
+
- document.getElementsByClassName()
|
4
編集>No.1: html構造の再検討
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -45,4 +45,24 @@
|
|
|
45
45
|
if(id_name === form_1){HtmlService.createTemplateFromFile("form_1").evaluate();}
|
|
46
46
|
else{HtmlService.createTemplateFromFile("form_2").evaluate();}
|
|
47
47
|
}
|
|
48
|
-
```
|
|
48
|
+
```
|
|
49
|
+
##編集
|
|
50
|
+
###No.1: html構造の再検討
|
|
51
|
+
既知の要素取得方法に基づいて、さまざまな要素取得方法を検証するために使いやすい構成を再検討しました。
|
|
52
|
+
```html
|
|
53
|
+
<body>
|
|
54
|
+
<div>
|
|
55
|
+
<p>Paragraph</p>
|
|
56
|
+
<form action="URL" method="post"><input type="text"><input type="submit"></form>
|
|
57
|
+
<form action="URL" method="post"><input type="text"><input type="submit"></form>
|
|
58
|
+
</div>
|
|
59
|
+
</body>
|
|
60
|
+
```
|
|
61
|
+
Div
|
|
62
|
+
├Paragraph
|
|
63
|
+
├Form
|
|
64
|
+
│├Input(text)
|
|
65
|
+
│└Input(button)
|
|
66
|
+
└Form
|
|
67
|
+
□├Input(text)
|
|
68
|
+
□└Input(button)
|
3
```
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -1,15 +1,15 @@
|
|
|
1
1
|
## Code
|
|
2
|
-
```
|
|
2
|
+
```html
|
|
3
3
|
<form action="URL" method="post" name ="form_1" id = "form_1"><input type="submit"></form>
|
|
4
4
|
<form action="URL" method="post" name ="form_2" id = "form_2"><input type="submit"></form>
|
|
5
5
|
```
|
|
6
|
-
```
|
|
6
|
+
```script
|
|
7
7
|
function doGet(){return HtmlService.createTemplateFromFile("index").evaluate();}
|
|
8
8
|
```
|
|
9
9
|
## Error
|
|
10
10
|
### name
|
|
11
11
|
ReferenceError: name is not defined
|
|
12
|
-
```
|
|
12
|
+
```script
|
|
13
13
|
function doPost() {
|
|
14
14
|
if(name === form_1){return HtmlService.createTemplateFromFile("form_1").evaluate();}
|
|
15
15
|
else{return HtmlService.createTemplateFromFile("form_2").evaluate();}
|
|
@@ -17,7 +17,7 @@
|
|
|
17
17
|
```
|
|
18
18
|
### id
|
|
19
19
|
ReferenceError: id is not defined
|
|
20
|
-
```
|
|
20
|
+
```script
|
|
21
21
|
function doPost() {
|
|
22
22
|
if(id === form_2){return HtmlService.createTemplateFromFile("form_1").evaluate();}
|
|
23
23
|
else{return HtmlService.createTemplateFromFile("form_2").evaluate();}
|
|
@@ -25,21 +25,21 @@
|
|
|
25
25
|
```
|
|
26
26
|
### onclick
|
|
27
27
|
スクリプトが完了しましたが、何も返されませんでした。
|
|
28
|
-
```
|
|
28
|
+
```html
|
|
29
29
|
<input type="submit" onclick = <?!= form_1(); ?>>
|
|
30
30
|
<input type="submit" onclick = <?!= form_2(); ?>>
|
|
31
31
|
```
|
|
32
|
-
```
|
|
32
|
+
```script
|
|
33
33
|
function form_1(){return HtmlService.createTemplateFromFile("form_1").evaluate();}
|
|
34
34
|
function form_2(){return HtmlService.createTemplateFromFile("form_2").evaluate();}
|
|
35
35
|
```
|
|
36
36
|
### .id & id
|
|
37
37
|
ReferenceError: id_name is not defined
|
|
38
|
-
```
|
|
38
|
+
```html
|
|
39
39
|
<input type="submit" onclick= <? forms(this); ?>>
|
|
40
40
|
<input type="submit" onclick= <? forms(this); ?>>
|
|
41
41
|
```
|
|
42
|
-
```
|
|
42
|
+
```script
|
|
43
43
|
function forms(x){const id_name = x.id; return id_name}
|
|
44
44
|
function doPost(){
|
|
45
45
|
if(id_name === form_1){HtmlService.createTemplateFromFile("form_1").evaluate();}
|
2
return id_name
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -40,7 +40,7 @@
|
|
|
40
40
|
<input type="submit" onclick= <? forms(this); ?>>
|
|
41
41
|
```
|
|
42
42
|
```index.gs
|
|
43
|
-
function forms(x){const id_name = x.id; return id_name
|
|
43
|
+
function forms(x){const id_name = x.id; return id_name}
|
|
44
44
|
function doPost(){
|
|
45
45
|
if(id_name === form_1){HtmlService.createTemplateFromFile("form_1").evaluate();}
|
|
46
46
|
else{HtmlService.createTemplateFromFile("form_2").evaluate();}
|
1
return id_name;
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -40,7 +40,7 @@
|
|
|
40
40
|
<input type="submit" onclick= <? forms(this); ?>>
|
|
41
41
|
```
|
|
42
42
|
```index.gs
|
|
43
|
-
function forms(x){const id_name = x.id; return id_name}
|
|
43
|
+
function forms(x){const id_name = x.id; return id_name;}
|
|
44
44
|
function doPost(){
|
|
45
45
|
if(id_name === form_1){HtmlService.createTemplateFromFile("form_1").evaluate();}
|
|
46
46
|
else{HtmlService.createTemplateFromFile("form_2").evaluate();}
|