回答編集履歴
4
追記
answer
CHANGED
|
@@ -17,7 +17,7 @@
|
|
|
17
17
|
'<table class="search" border="1">' +
|
|
18
18
|
'<tr bgcolor="#aaccff"><th>カテゴリ</th><th>用語</th><th>内容</th></tr>';
|
|
19
19
|
|
|
20
|
-
myData.forEach(e => {
|
|
20
|
+
myData.forEach((e) => {
|
|
21
21
|
var category = e[0];
|
|
22
22
|
var word = e[1];
|
|
23
23
|
var content = e[2];
|
3
修正
answer
CHANGED
|
@@ -33,8 +33,7 @@
|
|
|
33
33
|
result += '<td width="20%" align="left" valign="top"><font color="#000000" size="2px">' + word + '</font></td>';
|
|
34
34
|
}
|
|
35
35
|
result += '<td valign="top"><font style="bold" size="2px" color="#000000">' + content + '</font></td>' +
|
|
36
|
-
'</tr>'
|
|
36
|
+
'</tr>'
|
|
37
|
-
'</table>'
|
|
38
37
|
})
|
|
39
38
|
result += "</table>"
|
|
40
39
|
|
2
追記
answer
CHANGED
|
@@ -1,5 +1,79 @@
|
|
|
1
1
|
追記
|
|
2
2
|
|
|
3
|
+
ノーテストで申し訳ないですが、これでいけるはずです！
|
|
4
|
+
|
|
5
|
+
|
|
6
|
+
```gas
|
|
7
|
+
const id = 'スプレッドシートのID';
|
|
8
|
+
const mySheet = SpreadsheetApp.openById(id).getSheetByName("用語集");
|
|
9
|
+
const endrow = mySheet.getLastRow();
|
|
10
|
+
const myData = mySheet.getRange(2, 1, endrow - 1, 4).getValues();
|
|
11
|
+
|
|
12
|
+
|
|
13
|
+
function getValue(searchWord) { //④
|
|
14
|
+
//スプレッドシートから必要な処理を行う。
|
|
15
|
+
|
|
16
|
+
var result = '検索文字=' + escape_html(searchWord) +
|
|
17
|
+
'<table class="search" border="1">' +
|
|
18
|
+
'<tr bgcolor="#aaccff"><th>カテゴリ</th><th>用語</th><th>内容</th></tr>';
|
|
19
|
+
|
|
20
|
+
myData.forEach(e => {
|
|
21
|
+
var category = e[0];
|
|
22
|
+
var word = e[1];
|
|
23
|
+
var content = e[2];
|
|
24
|
+
var url = e[3];
|
|
25
|
+
|
|
26
|
+
result += '<tr>' +
|
|
27
|
+
'<td width="10%" valign="top"><font color="#000000" size="2px">' + category + '</font></td>';
|
|
28
|
+
|
|
29
|
+
if (searchWord || word.indexOf(searchWord) !== -1) {
|
|
30
|
+
var replace = word.replace(searchWord, '<font color="#ff0000" size="2px"><b>' + search + '</b></font>');
|
|
31
|
+
result += '<td width="20%" align="left" valign="top"><font size="2px">' + replace + '</font></td>';
|
|
32
|
+
} else {
|
|
33
|
+
result += '<td width="20%" align="left" valign="top"><font color="#000000" size="2px">' + word + '</font></td>';
|
|
34
|
+
}
|
|
35
|
+
result += '<td valign="top"><font style="bold" size="2px" color="#000000">' + content + '</font></td>' +
|
|
36
|
+
'</tr>' +
|
|
37
|
+
'</table>'
|
|
38
|
+
})
|
|
39
|
+
result += "</table>"
|
|
40
|
+
|
|
41
|
+
if (myData.length <= 1) {
|
|
42
|
+
result += '検索できませんでした。キーワードを変えてもう一度検索してください。'
|
|
43
|
+
}
|
|
44
|
+
|
|
45
|
+
return result
|
|
46
|
+
}
|
|
47
|
+
|
|
48
|
+
function escape_html(string) {
|
|
49
|
+
if (typeof string !== 'string') {
|
|
50
|
+
return string;
|
|
51
|
+
}
|
|
52
|
+
return string.replace(/[&'`"<>]/g, function (match) {
|
|
53
|
+
return {
|
|
54
|
+
'&': '&',
|
|
55
|
+
"'": ''',
|
|
56
|
+
'`': '`',
|
|
57
|
+
'"': '"',
|
|
58
|
+
'<': '<',
|
|
59
|
+
'>': '>',
|
|
60
|
+
}[match]
|
|
61
|
+
});
|
|
62
|
+
}
|
|
63
|
+
|
|
64
|
+
|
|
65
|
+
|
|
66
|
+
function doGet(e) {
|
|
67
|
+
return HtmlService.createTemplateFromFile("index").evaluate();
|
|
68
|
+
|
|
69
|
+
}
|
|
70
|
+
|
|
71
|
+
```
|
|
72
|
+
|
|
73
|
+
|
|
74
|
+
---
|
|
75
|
+
追記
|
|
76
|
+
|
|
3
77
|
コードバッサリ省略させていただきました！
|
|
4
78
|
|
|
5
79
|
①送信ボタンを押すとsend（）が呼ばれます。
|
1
修正
answer
CHANGED
|
@@ -1,3 +1,78 @@
|
|
|
1
|
+
追記
|
|
2
|
+
|
|
3
|
+
コードバッサリ省略させていただきました！
|
|
4
|
+
|
|
5
|
+
①送信ボタンを押すとsend（）が呼ばれます。
|
|
6
|
+
②検索値を取得します。
|
|
7
|
+
③検索値をGAS側のgetValue関数に、検索値を渡します。
|
|
8
|
+
④GAS側で必要な処理を行い、値を返します。
|
|
9
|
+
⑤ ④が成功したらinnerHTMLFunc関数を呼び出します。
|
|
10
|
+
⑥HTMLに値を書き込みます。
|
|
11
|
+
|
|
12
|
+
|
|
13
|
+
こんな流れになります。
|
|
14
|
+
|
|
15
|
+
今のコードを見させていただくと、
|
|
16
|
+
<?= … ?>でhtml上でGAS側の処理を行われているようなので、管理や修正がしにくい状態になっています。
|
|
17
|
+
そのためdoGetが呼び出された時に、スプレッドシートの内容を取得し、グローバル変数等に保存しておきます。
|
|
18
|
+
そして、htmlが読み込まれる際に、処理を行い表示してあげれば良いかと！
|
|
19
|
+
|
|
20
|
+
すみません、全部のコード修正しようと思ったんですが、諦めてしまいました。
|
|
21
|
+
|
|
22
|
+
|
|
23
|
+
```html
|
|
24
|
+
<html>
|
|
25
|
+
|
|
26
|
+
<body>
|
|
27
|
+
<form name="searchForm">
|
|
28
|
+
検索文字：<input type="text" width="30%" id="searchWord">
|
|
29
|
+
<input type="button" value="送信" onclick="send()"> //①
|
|
30
|
+
<div id="innerResluts"></div>
|
|
31
|
+
</form>
|
|
32
|
+
|
|
33
|
+
|
|
34
|
+
<script>
|
|
35
|
+
// HTMLに書き込む処理
|
|
36
|
+
function innerHTMLFunc(resluts) { //⑥
|
|
37
|
+
innerResluts.innerHTML = resluts
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
function send() {
|
|
41
|
+
//検索ワード
|
|
42
|
+
var searchWord = document.getElementById("searchWord") //②
|
|
43
|
+
//GAS側の関数を呼び出す。
|
|
44
|
+
//=>GAS側:getValue関数（検索値）成功したら、HTML側:innerHTMLFuncに結果を渡す。
|
|
45
|
+
google.script.run.withSuccessHandler(innerHTMLFunc) //③ //⑤
|
|
46
|
+
.getValue(searchWord.value)
|
|
47
|
+
}
|
|
48
|
+
|
|
49
|
+
</script>
|
|
50
|
+
</body>
|
|
51
|
+
|
|
52
|
+
</html>
|
|
53
|
+
|
|
54
|
+
```
|
|
55
|
+
```gas
|
|
56
|
+
const id ='スプレッドシートのID';
|
|
57
|
+
const mySheet = SpreadsheetApp.openById(id).getSheetByName("用語集");
|
|
58
|
+
const endrow = mySheet.getLastRow();
|
|
59
|
+
const myData = mySheet.getRange(2, 1 , endrow-1 , 4).getValues();
|
|
60
|
+
|
|
61
|
+
|
|
62
|
+
function getValue(searchWord){ //④
|
|
63
|
+
//スプレッドシートから必要な処理を行う。
|
|
64
|
+
var resluts = "サンプルテキスト 検索値は:"+searchWord;
|
|
65
|
+
return resluts
|
|
66
|
+
}
|
|
67
|
+
function doGet(e) {
|
|
68
|
+
return HtmlService.createTemplateFromFile("index").evaluate();
|
|
69
|
+
|
|
70
|
+
}
|
|
71
|
+
```
|
|
72
|
+
|
|
73
|
+
---
|
|
74
|
+
|
|
75
|
+
|
|
1
76
|
簡易版にして試してみたのですがGASの仕様か不明ですが元のURLに戻ってこれませんでした。
|
|
2
77
|
循環してしまうので、ダメなのかも。。。
|
|
3
78
|
|