質問編集履歴

2

タイトルを変更しました。htmlを全文載せました。

2024/01/26 02:26

投稿

Demski
Demski

スコア7

test CHANGED
File without changes
test CHANGED
@@ -14,12 +14,7 @@
14
14
  org.thymeleaf.exceptions.TemplateInputException: An error happened during template parsing (template: "class path resource [templates//work3/form.html]")
15
15
  at
16
16
    (略)
17
- Caused by: org.attoparser.ParseException: Error during execution of processor 'org.thymeleaf.spring6.processor.SpringInputGeneralFieldTagProcessor' (template: "/form" - line 90, col 69)
17
+ Caused by: org.attoparser.ParseException: Error during execution of processor 'org.thymeleaf.spring6.processor.SpringInputGeneralFieldTagProcessor' (template: "/work3/form" - line 86, col 69)
18
- at org.attoparser.MarkupParser.parseDocument(MarkupParser.java:393)
19
- at org.attoparser.MarkupParser.parse(MarkupParser.java:257)
20
- at org.thymeleaf.templateparser.markup.AbstractMarkupTemplateParser.parse(AbstractMarkupTemplateParser.java:230)
21
- ... 92 more
22
-
23
18
  ```
24
19
 
25
20
  ### 該当のソースコード
@@ -39,6 +34,7 @@
39
34
  <!-- custom.css destyle -->
40
35
  <link rel="stylesheet" th:href="@{../css/work3/work3.css}">
41
36
  <link rel="stylesheet" th:href="@{../css/work3/form.css}">
37
+
42
38
  </head>
43
39
 
44
40
  <body>
@@ -81,6 +77,12 @@
81
77
  </h1>
82
78
  </div>
83
79
 
80
+ <nav class="breadcrumb" aria-label="パンくずナビゲーション">
81
+ <ol class="breadcrumb-list">
82
+ <li class="breadcrumb-item"><a th:href="@{/work3/index}">ホーム</a></li>
83
+ <li class="breadcrumb-item"><a href="#" aria-current="page">お問い合わせ</a></li>
84
+ </ol>
85
+ </nav>
84
86
  <main>
85
87
  <div class="form-container">
86
88
  <h2>お問い合について</h2>

1

タイトルを修正し、htmlを全文載せました。

2024/01/26 02:12

投稿

Demski
Demski

スコア7

test CHANGED
@@ -1 +1 @@
1
- Spring 使用し Web フォームを作成および送信したい
1
+ inputタグに「th:field="*{...}"」等入れると、「500エラー」が出、表示出来なくなります
test CHANGED
@@ -2,9 +2,8 @@
2
2
  SpringのThymeleaf を使って、お問い合わせフォームを作ってPOST送信し、確認画面を表示させたいです。
3
3
 
4
4
  ### 発生している問題・分からないこと
5
- [公式サイト](https://spring.pleiades.io/guides/gs/handling-form-submission/)を参考にフォームを作成したのですが、inputタグに「th:field="*{name}"」を入れると、「500エラー」が出て、表示出来なくなります。
5
+ [サンプルサイト](https://spring.pleiades.io/guides/gs/handling-form-submission/)を参考にフォームを作成したのですが、inputタグに「th:field="*{...}"」を入れると、「500エラー」が出て、表示出来なくなります。
6
-
6
+ th:field="*{...}"関連の部分をなくすとHTMLは表示されます。
7
-
8
7
  ### エラーメッセージ
9
8
  ```error
10
9
  This application has no explicit mapping for /error, so you are seeing this as a fallback.
@@ -13,14 +12,7 @@
13
12
  There was an unexpected error (type=Internal Server Error, status=500).
14
13
  An error happened during template parsing (template: "class path resource [templates//form.html]")
15
14
  org.thymeleaf.exceptions.TemplateInputException: An error happened during template parsing (template: "class path resource [templates//work3/form.html]")
16
- at org.thymeleaf.templateparser.markup.AbstractMarkupTemplateParser.parse(AbstractMarkupTemplateParser.java:241)
17
- at org.thymeleaf.templateparser.markup.AbstractMarkupTemplateParser.parseStandalone(AbstractMarkupTemplateParser.java:100)
18
- at org.thymeleaf.engine.TemplateManager.parseAndProcess(TemplateManager.java:666)
19
- at org.thymeleaf.TemplateEngine.process(TemplateEngine.java:1103)
15
+ at
20
- at org.thymeleaf.TemplateEngine.process(TemplateEngine.java:1077)
21
- at org.thymeleaf.spring6.view.ThymeleafView.renderFragment(ThymeleafView.java:372)
22
- at org.thymeleaf.spring6.view.ThymeleafView.render(ThymeleafView.java:192)
23
- at org.springframework.web.servlet.DispatcherServlet.render(DispatcherServlet.java:1431)
24
16
    (略)
25
17
  Caused by: org.attoparser.ParseException: Error during execution of processor 'org.thymeleaf.spring6.processor.SpringInputGeneralFieldTagProcessor' (template: "/form" - line 90, col 69)
26
18
  at org.attoparser.MarkupParser.parseDocument(MarkupParser.java:393)
@@ -32,8 +24,75 @@
32
24
 
33
25
  ### 該当のソースコード
34
26
 
35
- ```form.htmlです
27
+ ```html
28
+ <!DOCTYPE html>
29
+ <html lang="ja" xmlns:th="https://www.thymeleaf.org">
30
+
31
+ <head>
32
+ <meta charset="UTF-8">
33
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
34
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
35
+ <title>Sample Cafe</title>
36
+ <meta name="description" content="コーヒーショップのサンプルサイトです。">
37
+ <!-- reset.css destyle -->
38
+ <link rel="stylesheet" th:href="@{../css/work3/reboot.min.css}" />
39
+ <!-- custom.css destyle -->
40
+ <link rel="stylesheet" th:href="@{../css/work3/work3.css}">
41
+ <link rel="stylesheet" th:href="@{../css/work3/form.css}">
42
+ </head>
43
+
44
+ <body>
45
+ <header class="header">
46
+ <a th:href="@{./index}">
47
+ <h1 class="header-logo">Sample Cafe</h1>
48
+ </a>
49
+ <!--バーガーメニューボタン-->
50
+ <button id="hamburger" class="hamburger" aria-label="メニューを開く">
51
+ <span class="hamburger_line" aria-hidden="true"></span>
52
+ </button>
53
+ <!--グローバルナビ-->
54
+ <nav id="gnav" class="gnav" aria-label="メインメニュー">
55
+ <ul class="gnav-list">
56
+ <li class="gnav-item">
57
+ <a href="#" class="gnav-link">Home</a>
58
+ </li>
59
+ <li class="gnav-item">
60
+ <a href="#" class="gnav-link">service</a>
61
+ </li>
62
+ <li class="gnav-item">
63
+ <a href="#" class="gnav-link">products</a>
64
+ </li>
65
+ <li class="gnav-item">
66
+ <a href="#" class="gnav-link">company</a>
67
+ </li>
68
+ <li class="gnav-item">
69
+ <a href="#" class="gnav-link">recruit</a>
70
+ </li>
71
+ <li class="gnav-item">
72
+ <a href="#" class="gnav-link">contact</a>
73
+ </li>
74
+ </ul>
75
+ </nav>
76
+ </header>
77
+ <div class="main">
78
+ <div class="page-header">
79
+ <h1 class="page-title">
80
+ お問い合わせ
81
+ </h1>
82
+ </div>
83
+
84
+ <main>
85
+ <div class="form-container">
86
+ <h2>お問い合について</h2>
87
+ <p>
88
+ 通常、3営業日以内に担当者よりご連絡差し上げます。<br />
89
+ お急ぎの場合はお電話にてご連絡下さい。(TEL: 03-1234-5678 平日9:00〜18:00)
90
+ </p>
91
+
92
+ <!--お問い合わせフォーム-->
93
+ <h2>お問い合フォーム</h2>
94
+
36
- <form action="#" method="POST" id="form" th:action="@{/work3/result}" th:object="${ContactForm}">
95
+ <form action="#" method="POST" id="form" th:action="@{/work3/result}" th:object="${ContactForm}">
37
96
  <table class="form-table" role="presentation">
38
97
 
39
98
  <tr>
@@ -55,7 +114,7 @@
55
114
  </label>
56
115
  </th>
57
116
  <td>
58
- <input type="text" id="email" name="email" placeholder="sample@sample.co.jp" th:field="*{email}" required />
117
+ <input type="text" id="email" name="email" placeholder="sample@sample.co.jp" th:field="*{email}" required />
59
118
  </td>
60
119
  </tr>
61
120
  <tr>
@@ -65,10 +124,58 @@
65
124
  </label>
66
125
  </th>
67
126
  <td>
68
- <input type="text" id="tell" name="tell" placeholder="03-1234-5678" th:filed="*{tell}" />
127
+ <input type="text" id="tell" name="tell" placeholder="03-1234-5678" th:field="*{tell}" />
69
- </td>
128
+ </td>
70
- </tr>
129
+ </tr>
71
-
130
+ <tr>
131
+ <th>
132
+ <div class="input-label">
133
+ 法人個人
134
+ <span class="require" aria-hidden="true">必須</span>
135
+ </div>
136
+ </th>
137
+ <td>
138
+ <div class="input-field">
139
+ <ul class="radio-list">
140
+ <li>
141
+ <label>
142
+ <input type="radio" name="attribute" value="法人" checked
143
+ th:field="*{attribute}" required /><span>法人</span>
144
+ </label>
145
+ </li>
146
+ <li>
147
+ <label>
148
+ <input type="radio" name="attribute" value="個人"
149
+ th:field="*{attribute}" required /><span>個人</span>
150
+ </label>
151
+ </li>
152
+ </ul>
153
+ </div>
154
+ </td>
155
+ </tr>
156
+ <tr>
157
+ <th>
158
+ <div class="input-label">
159
+ <label for="contact-type">
160
+ お問い合わせの種類
161
+ <span class="require" aria-hidden="true">必須</span>
162
+ </label>
163
+ </div>
164
+ </th>
165
+ <td>
166
+ <div class="input-field">
167
+ <div class="select-wrap">
168
+ <select name="type" id="contact_type" th:field="*{type}">
169
+ <option value="" selected disabled>選択してください</option>
170
+ <option value="商品について">商品について</option>
171
+ <option value="返品・交換について">返品・交換について</option>
172
+ <option value="メディア取材について">メディア取材について</option>
173
+ <option value="その他のお問合せ">その他のお問合せ</option>
174
+ </select>
175
+ </div>
176
+ </div>
177
+ </td>
178
+ </tr>
72
179
  <tr>
73
180
  <th>
74
181
  <label for="msg" class="input-label">
@@ -78,20 +185,52 @@
78
185
  </th>
79
186
  <td>
80
187
  <div class="input-field">
81
- <textarea name="comment" id="comment" cols="30" rows="10" th:filed="*{comment}"
188
+ <textarea name="comment" id="comment" cols="30" rows="10"
82
- required>お問い合わせ内容を記入してください。</textarea>
189
+ th:field="*{comment}" required>お問い合わせ内容を記入してください。</textarea>
83
190
  </div>
84
191
  </td>
85
192
  </tr>
86
193
  </table>
87
194
 
195
+ <div class="privacy-box">
196
+ <p id="privacy-description">「<a
197
+ th:href="@{/work3/privacy}">プライバシーポリシー</a>」をご確認いただき、個人情報の取扱いについて同意いただける場合は「同意する」を選択してください。
198
+ </p>
199
+ <div class="privacy-box-check">
200
+ <label>
201
+ <input type="checkbox" id="agree" name="agree" value="同意します" required
202
+ aria-describedby="privacy-description">
203
+ <span>個人情報保護方針に同意する</span>
204
+ </label>
205
+ </div>
206
+ </div>
88
207
  <div class="button-center">
89
208
  <button id="submit" class="button button--action button--lg" disabled>入力内容を確認する</button>
90
209
  </div>
91
210
  </form>
211
+ </div>
212
+ </main>
213
+ </div>
214
+
215
+ <footer class="footer">
216
+ <ul class="footer-menu">
217
+ <li><a th:href="@{./law}">特定商取引法に関する表記</a></li>
218
+ <li><a th:href="@{./privacy}">プライバシーポリシー</a></li>
219
+ </ul>
220
+ <p class="footer-copyright"><small lang="en">&copy; Sample All Rights Reserved.</small></p>
221
+ </footer>
222
+
223
+ <script src="https://code.jquery.com/jquery-3.6.0.min.js"
224
+ integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>
225
+ <script th:src="@{../js/work3/script.js}"></script>
226
+ </body>
227
+
228
+ </html>
92
229
  ```
93
230
 
231
+ ```java
94
- ```controllerです
232
+ //WebControllers.java
233
+
95
234
  package com.example.demo.controller;
96
235
 
97
236
  import org.springframework.stereotype.Controller;
@@ -113,16 +252,16 @@
113
252
  registry.addViewController("/results").setViewName("results");
114
253
  }
115
254
 
116
- @GetMapping("/form")
255
+ @GetMapping("/work3/form")
117
256
  public String ContactForm(ContactForm personForm) {
118
- return "/form";
257
+ return "/work3/form";
119
- }
258
+ }
120
-
259
+
121
- @PostMapping("/form")
260
+ @PostMapping("/work3/form")
122
261
  public String checkPersonInfo(@Valid ContactForm personForm, BindingResult bindingResult) {
123
262
 
124
263
  if (bindingResult.hasErrors()) {
125
- return "/form";
264
+ return "/work3/form";
126
265
  }
127
266
 
128
267
  return "redirect:/results";
@@ -130,7 +269,8 @@
130
269
  }
131
270
  ```
132
271
 
272
+ ```Java
133
- ```ContactFormです
273
+ //ContactForm.java
134
274
  package com.example.demo.form;
135
275
 
136
276
  import jakarta.validation.constraints.Email;
@@ -138,20 +278,33 @@
138
278
  import jakarta.validation.constraints.Size;
139
279
 
140
280
  public class ContactForm {
141
-
281
+ package com.example.demo.form;
282
+
283
+ import jakarta.validation.constraints.Email;
284
+ import jakarta.validation.constraints.NotNull;
285
+ import jakarta.validation.constraints.Size;
286
+
287
+ public class ContactForm {
288
+
142
- @NotNull
289
+ @NotNull
143
- @Size(min = 1, max = 20, message = "Please input 20 characters or less")
290
+ @Size(min = 1, max = 400)
291
+ private String comment;
292
+
293
+ @NotNull
294
+ @Size(min = 1, max = 20)
144
295
  private String name;
145
296
 
146
297
  @NotNull
147
298
  @Email(message = "Invalid E-mail Format")
148
299
  private String email;
149
300
 
301
+ @NotNull
302
+ private String type;
303
+
150
304
  private String tell;
151
305
 
152
306
  @NotNull
153
- @Size(min = 1, max = 400, message = "400文字以内で記入してください")
154
- private String comment;
307
+ private String attribute;
155
308
 
156
309
  //name
157
310
  public String getName() {
@@ -171,6 +324,15 @@
171
324
  this.email = email;
172
325
  }
173
326
 
327
+ //type
328
+ public String getType() {
329
+ return type;
330
+ }
331
+
332
+ public void setType(String type) {
333
+ this.type = type;
334
+ }
335
+
174
336
  //comment
175
337
  public String getComment() {
176
338
  return comment;
@@ -180,11 +342,25 @@
180
342
  this.comment = comment;
181
343
  }
182
344
 
345
+ //type
346
+ public String getTell() {
347
+ return tell;
348
+ }
349
+
350
+ public void setTell(String tell) {
351
+ this.tell = tell;
352
+ }
353
+
354
+ //type
355
+ public String getAttribute() {
356
+ return attribute;
357
+ }
183
358
 
184
359
  public void setAttribute(String attribute) {
185
360
  this.attribute = attribute;
186
361
  }
187
362
  }
363
+
188
364
 
189
365
  ```
190
366