teratail
回答率
85.31%
teratail header banner
teratail header banner
質問するログイン新規登録
トップGoogle Apps Scriptに関する質問入力ホームのtext及びselectにrequiredをgoogle app scriptで作成したい

編集履歴

質問編集履歴

5

写真削除

2023/11/25 02:07

投稿

nobinomio
nobinomio

スコア45

test CHANGED
File without changes
test CHANGED
@@ -129,7 +129,7 @@
129
129
  }
130
130
  }
131
131
  ```
132
- ![イメージ説明](https://ddjkaamml8q8x.cloudfront.net/questions/2023-11-23/277b99c7-2519-4897-b40a-076fdf42bfb3.jpeg)
132
+
133
133
 
134
134
  ### 試したこと
135
135
  上記、requiredコードを記入してみたのですが、textに記入なしで、登録ボタンを押したのですが、未記入の内容で普通に登録できてしまいました。
@@ -137,7 +137,4 @@
137
137
  普段、required をコードで記入することがなくよくわかりません。
138
138
  わかる方教えていただけますか？
139
139
 
140
- 追記で写真をアップしています。
141
- submit完了と同時に"このフィールドに値を入れてください"が出ます。
142
140
 
143
-
Google Apps Script

4

写真追記

2023/11/23 05:35

投稿

nobinomio
nobinomio

スコア45

test CHANGED
File without changes
test CHANGED
@@ -129,6 +129,7 @@
129
129
  }
130
130
  }
131
131
  ```
132
+ ![イメージ説明](https://ddjkaamml8q8x.cloudfront.net/questions/2023-11-23/277b99c7-2519-4897-b40a-076fdf42bfb3.jpeg)
132
133
 
133
134
  ### 試したこと
134
135
  上記、requiredコードを記入してみたのですが、textに記入なしで、登録ボタンを押したのですが、未記入の内容で普通に登録できてしまいました。
@@ -136,3 +137,7 @@
136
137
  普段、required をコードで記入することがなくよくわかりません。
137
138
  わかる方教えていただけますか？
138
139
 
140
+ 追記で写真をアップしています。
141
+ submit完了と同時に"このフィールドに値を入れてください"が出ます。
142
+
143
+
Google Apps Script

3

code修正

2023/11/22 12:56

投稿

nobinomio
nobinomio

スコア45

test CHANGED
File without changes
test CHANGED
@@ -106,6 +106,29 @@
106
106
 
107
107
 
108
108
  ```
109
+ ```js
110
+ // -----------------------------------------------------
111
+ // メンバーIDからメンバーの名前を取得する関数
112
+ // -----------------------------------------------------
113
+ // 引数:照合させるメンバーID
114
+ function getMemberName(val) {
115
+
116
+ const sheet = getSheet('*********************************', 'シート1');
117
+ // シートの最終行を取得
118
+ const lastRow = sheet.getLastRow();
119
+
120
+ // シートの2行目から最終行まで繰り返し処理
121
+ for (let i = 2; i <= lastRow; i++) {
122
+ // 1列目のi行目の値を取得し変数memberIdへ格納
123
+ const memberId = sheet.getRange(i, 1).getValue();
124
+ // memberIdがvalと等しければ、2列目i行目の値（memberName）を返す
125
+ if (String(memberId) === val) {
126
+ const memberName = sheet.getRange(i, 2).getValue();
127
+ return memberName;
128
+ }
129
+ }
130
+ }
131
+ ```
109
132
 
110
133
  ### 試したこと
111
134
  上記、requiredコードを記入してみたのですが、textに記入なしで、登録ボタンを押したのですが、未記入の内容で普通に登録できてしまいました。
Google Apps Script

2

code修正

2023/11/22 12:50

投稿

nobinomio
nobinomio

スコア45

test CHANGED
File without changes
test CHANGED
@@ -46,8 +46,29 @@
46
46
  <div class="wrap">
47
47
  <input type="submit"class="submit" onClick="addBtnClick()" value="登録する">
48
48
  </div>
49
+ ```
50
+ ```js
51
+ //member-id に対応する member-name を引っ張ってくるコードを追記
52
+ // メンバーIDからメンバー名を取得してインプットボックスmember-nameへ出力する関数
53
+ function outputMemberName(memberId) {
54
+ google.script.run.withSuccessHandler(function(memberName){
55
+ if (memberName) {
56
+ document.getElementById('member-name').value = memberName;
57
+ } else {
58
+ document.getElementById('member-name').value = '';
59
+ }
60
+ }).getMemberName(memberId);
61
+ }
62
+ // 追記いただいたcode
63
+ document.addEventListener('DOMContentLoaded', () => {
64
+ const form = document.getElementById('myform');
65
+ form.addEventListener('submit', (event) => {
66
+ event.preventDefault();
49
- <script>
67
+ addBtnClick();
68
+ });
69
+ });
70
+ // -----------------------------------------------------
50
- function addBtnClick() {
71
+ function addBtnClick() {
51
72
  // 実行してよいか確認する
52
73
  const checkAddFlg = window.confirm('登録を実行してもよろしいですか？');
53
74
 
@@ -55,42 +76,36 @@
55
76
  // フォームの入力値を取得する
56
77
  const memberId = document.getElementById('member-id').value;
57
78
  const memberName = document.getElementById('member-name').value;
79
+ const han = document.getElementById('han').value;
58
- const han = document.getElementById('han').value; google.script.run.withSuccessHandler(dataAddSuccess).withFailureHandler(dataAddFail).addData(memberId, memberName, han);
80
+ google.script.run.withSuccessHandler(dataAddSuccess).withFailureHandler(dataAddFail).addData(memberId, memberName, han);
59
81
  } else {
60
82
  alert("登録をキャンセルしました");
61
83
  }
62
84
  }
85
+
86
+ // -----------------------------------------------------
63
- function dataAddSuccess() {
87
+ function dataAddSuccess() {
64
88
  // アラートを表示し、入力フォームの値をリセットする
65
89
  alert("登録に成功しました");
66
90
  document.getElementById('member-id').value = '';
67
91
  document.getElementById('member-name').value = '';
68
92
  document.getElementById('han').value = '-';
69
93
  }
94
+ // -----------------------------------------------------
70
- function dataAddFail() {
95
+ function dataAddFail() {
96
+ // アラートを表示する
71
- alert("登録に失敗しました");
97
+ alert("登録に失敗しました");
72
98
  }
99
+ // -----------------------------------------------------
100
+ // 質問に記載されていないのでダミー処理を実装
101
+ function outputMemberName(value) {
102
+ console.log(value)
103
+ }
104
+
73
- </script>
105
+ </script>
74
- </body>
106
+
75
- </html>
107
+
76
108
  ```
77
- ```js
78
- function doGet(e) {
79
- let page = e.parameter.page;
80
- if (!page) {
81
- page = 'index';
82
- }
83
- return HtmlService.createTemplateFromFile(page).evaluate();
84
- }
85
-
86
- function setRequired( $required ) {
87
- var $elementReference = document.getElementById( "member-id", "han");
88
- $elementReference.required = $required;
89
- var $required = $elementReference.required;
90
- document.getElementById( "index" ).innerHTML = $required;
91
- }
92
- ```
93
-
94
109
 
95
110
  ### 試したこと
96
111
  上記、requiredコードを記入してみたのですが、textに記入なしで、登録ボタンを押したのですが、未記入の内容で普通に登録できてしまいました。
Google Apps Script

1

submitボタンを追記しました

2023/11/22 05:10

投稿

nobinomio
nobinomio

スコア45

test CHANGED
File without changes
test CHANGED
@@ -7,6 +7,8 @@
7
7
 
8
8
  今回はコードの中でgoogleスクリプトの呼び出しでフォームの登録を行ってるためsubmitイベントが起こりませんでした。
9
9
  よって自分でスクリプト内で必須項目が空かどうかのチェックをする必要がありコードを組みましたがうまく発動されませんでした。
10
+
11
+ 番号を入力したら、名前が自動に出るようにscriptを組んでいる為、名前にはrequiredを付けず、番号と班にのみrequiredを付けたいとかんがえています
10
12
 
11
13
  ```index.html
12
14
  <html>
@@ -33,13 +35,17 @@
33
35
  <label for="han">
34
36
  <span class="label">必須</span>班</label>
35
37
  <div class="form-text">
36
- <select name="han"class="txt" id="han">
38
+ <select name="han"class="txt" id="han"required="required">
37
39
  <option value="-" hidden>-</option>
38
40
  <option value="1">1</option>
39
41
  <option value="2">2</option>
40
42
  </select>
41
43
  </div>
42
44
  </div>
45
+ //下記追加しています。
46
+ <div class="wrap">
47
+ <input type="submit"class="submit" onClick="addBtnClick()" value="登録する">
48
+ </div>
43
49
  <script>
44
50
  function addBtnClick() {
45
51
  // 実行してよいか確認する
Google Apps Script