header ads

SpringBoot Submit処理をJavaScriptでやりたいです

9月 02, 2022

前提

現在Spring boot + Thymeleafで開発をしています。
初心者のため、詳しくご教授頂けると幸いです。

実現したいこと

画像をSubmitボタンの代わりに使用したいため、Submitの処理をJavascriptで作りました。
Eclipseで作成し、ローカルで動かしたときはうまくSubmit処理ができました。

しかし、Webサーバに移行し、Apache＋Tomcatで動かすと
Not Found
The requested URL was not found on this server.
のエラー画面になり、Submitできません。

Eclipseで動かすのと、Webサーバで動かすのは何が違うのでしょうか？

発生している問題・エラーメッセージ

Not Found The requested URL was not found on this server.
2022-09-02 15:27:39.023 DEBUG 12332 --- [0:1-8009-exec-8] o.s.web.servlet.DispatcherServlet : GET "/web-euctools/images/spacer.gif", parameters={} 2022-09-02 15:27:39.023 DEBUG 12332 --- [0:1-8009-exec-1] o.s.web.servlet.DispatcherServlet : GET "/web-euctools/images/btn_sakujo.gif", parameters={} 2022-09-02 15:27:39.023 DEBUG 12332 --- [0:1-8009-exec-8] o.s.w.s.handler.SimpleUrlHandlerMapping : Mapped to ResourceHttpRequestHandler [Classpath [META-INF/resources/], Classpath [resources/], Classpath [static/], Classpath [public/], ServletContext [/]] 2022-09-02 15:27:39.039 DEBUG 12332 --- [0:1-8009-exec-8] o.s.web.servlet.DispatcherServlet : Completed 304 NOT_MODIFIED 2022-09-02 15:27:39.039 DEBUG 12332 --- [0:1-8009-exec-8] o.s.web.servlet.DispatcherServlet : GET "/web-euctools/images/btn_kosin.gif", parameters={} 2022-09-02 15:27:39.039 DEBUG 12332 --- [0:1-8009-exec-8] o.s.w.s.handler.SimpleUrlHandlerMapping : Mapped to ResourceHttpRequestHandler [Classpath [META-INF/resources/], Classpath [resources/], Classpath [static/], Classpath [public/], ServletContext [/]] 2022-09-02 15:27:39.039 DEBUG 12332 --- [0:1-8009-exec-8] o.s.web.servlet.DispatcherServlet : Completed 304 NOT_MODIFIED 2022-09-02 15:27:39.039 DEBUG 12332 --- [0:1-8009-exec-1] o.s.w.s.handler.SimpleUrlHandlerMapping : Mapped to ResourceHttpRequestHandler [Classpath [META-INF/resources/], Classpath [resources/], Classpath [static/], Classpath [public/], ServletContext [/]] 2022-09-02 15:27:39.054 DEBUG 12332 --- [0:1-8009-exec-1] o.s.web.servlet.DispatcherServlet : Completed 304 NOT_MODIFIED

該当のソースコード

HTML

<!DOCTYPE html> <html xmlns:th="http://www.thymeleaf.org"> <head> <meta charset="UTF-8"> <link th:href="@{/css/style.css}" rel="stylesheet"> <script th:src="@{/js/common.js}"></script> <title>EUCtools</title> <title>ユーザー編集</title> </head> <body> <div id="Layer0" class="titleArea">&nbsp;</div> <div id="Layer1" class="dateArea"><span th:text="${today}"></span></div> <div id="Layer2" class="userArea" rendered="#{gamenKyotu.syainName!=null}">ログインユーザー：<span th:text="${loginname}"></span></div> <div id="Layer3" class="endBtnArea"><a onclick="return closeWindow();"><img src="../../images/btn_end.gif" alt="終了" class="imgBtn"></a></div> <div id="Layer4" class="screenNaviArea"><span value="#{gamenKyotu.navigationBar}">ユーザー編集画面</span></div> <div id="Layer5" class="screenTitleArea1"></div> <div id="Layer6" class="screenTitleText"></div> <div id="Layer7"><span>X99-99-99G</span></div> <div id="Layer8" class="bodyAreaNew"> <div class="container"> <div th:if="${validationError}" th:each="error : ${validationError}"> <label class="text-danger" th:text="${error}"></label> </div> <form th:action="@{/userList/update}" th:object="${userDto}" th:method="post"> <table cellpadding="0" cellspacing="0"> <col style="width:150px"> <col style="width:250px"> <tr> <td colspan="2" class="spacer"><img src="../../images/spacer.gif" height="20"></td> </tr> <tr> <th>ユーザーＩＤ</th> <td colspan=2 class="left"> <p th:text="*{userid}"></p><input type="hidden" th:field="*{userid}" th:value="*{userid}"></input> </td> </tr> <tr> <th>パスワード</th> <td colspan=2 class="left"> <input type="text" size="10" maxlength="10" th:field="*{pswd}" th:value="*{pswd}" class="inputn"></input> </td> </tr> <tr> <th>パスワード再入力</th> <td colspan=2 class="left"> <input type="text" size="10" maxlength="10" th:field="*{repswd}" th:value="*{repswd}" class="inputn"></input> </td> </tr> <tr> <th>氏　名</th> <td colspan=2 class="left"> <input type="text" size="40" maxlength="30" th:field="*{user_name}" class="inputn"></input> </td> </tr> <tr> <th>グループＩＤ</th> <td colspan=2 class="left"> <select th:field="*{groupid}"> <option value=""></option> <option th:each="grouplist : ${grouplist}" th:value="${grouplist.groupid}" th:text="${grouplist.group_name}"></option> </select> </td> </tr> <tr> <th>権限レベル</th> <td colspan=2 class="left"> <select th:field="*{permit}"> <option value=""></option> <option value="A">管理者</option> <option value="B">利用ユーザ</option> </select> </td> </tr> </table> </form> </div> </div> <div id="Layer11" class="btnArea"> <table> <tr> <td width="10" class="nonp">&nbsp;</td> <td width="110" class="nonp"><a onclick="formSubmit('/userList/update');"><img src="../../images/btn_kosin.gif" alt="更新" class="imgBtn" /></a></td><td width="10" class="nonp">&nbsp;</td> <td width="110" class="nonp"><a onclick="formSubmit('/userList/delete');"><img src="../../images/btn_sakujo.gif" alt="削除" class="imgBtn" /></a></td><td width="10" class="nonp">&nbsp;</td> <td width="110" class="nonp">&nbsp;</td><td width="10" class="nonp">&nbsp;</td> <td width="110" class="nonp">&nbsp;</td><td width="10" class="nonp">&nbsp;</td> <td width="110" class="nonp">&nbsp;</td><td width="10" class="nonp">&nbsp;</td> <td width="110" class="nonp">&nbsp;</td><td width="10" class="nonp">&nbsp;</td> <td width="110" class="nonp">&nbsp;</td><td width="10" class="nonp">&nbsp;</td> <td width="110" class="nonp">&nbsp;</td><td width="10" class="nonp">&nbsp;</td> <td width="110" class="nonp"><a th:href="@{/userList}"><img src="../../images/btn_modoru.gif" alt="戻る" class="imgBtn"/></a></td><td width="10" class="nonp">&nbsp;</td> <td width="10" class="nonp">&nbsp;</td> </tr> </table> </div> </body> </html>

Java（@Controller）

@Controllerpublic class UserController { @Autowired HttpSession session; @Autowired UserService userService; @Autowired GroupService groupService; @PostMapping(value = "/userList/update") public String update(@Validated @ModelAttribute UserDto userDto, BindingResult result, Model model){ System.out.println(userDto.getUser_name()); if (result.hasErrors()) { List<String> errorList = new ArrayList<String>(); for (ObjectError error : result.getAllErrors()) { errorList.add(error.getDefaultMessage()); } model.addAttribute("validationError", errorList); return "userEdit"; } // ユーザー情報の更新 userService.update(userDto); return "redirect:/userList"; } @GetMapping("/userList/delete") public String delete(@PathVariable String userid) { // ユーザー情報の削除 userService.delete(userid); return "redirect:/userList"; }}

Javascript

function formSubmit(path){ if(!path){ alert('パスを指定してください'); return; } let form = document.getElementsByTagName('form')[0]; if(!form){ alert('フォームが取得できませんでした'); return; } form.action=path; form.method="post"; form.submit();}

補足情報（FW/ツールのバージョンなど）

WebサーバはWindowsです。

ここにより詳細な情報を記載してください。

hsmw

hsmw

コメントを投稿

0 コメント