前提・実現したいこと
SpringからAjaxにList型の値を送って、それをHTML(thymeleaf)上にtableで表示したいのですが、
どうもやり方がよく分かりません
該当のソースコード
javascript
1/** 2 * 基本給登録ページ 3 */ 4function monthsSelect(obj){ 5 var objVar = obj.value; 6 $.ajax({ 7 type : "GET", 8 url : "baseSalaryMonth", 9 data: { 10 baseSalaryMonthStr: objVar 11 }, 12 dataType : "json" 13 }) 14 .then( 15 function (data) { 16 //通信成功 17 alert("読み込み成功"); 18 $('#baseSalaryList').val(data); 19 }, 20 function () { 21 //通信失敗 22 alert("読み込み失敗"); 23 }); 24} 25}
java
1 @RequestMapping(value = "/baseSalaryMonth" , method = RequestMethod.GET) 2 @ResponseBody 3 public List<BaseSalary> baseSalarySelectMonth(String baseSalaryMonthStr, ModelAndView mav)throws JsonParseException, JsonMappingException, IOException{ 4 System.out.println(baseSalaryMonthStr); 5 int aseSalaryMonth = Integer.parseInt(baseSalaryMonthStr); 6 List<BaseSalary> baseSalaryList = baseSalaryService.baseSalary(aseSalaryMonth); 7 return baseSalaryList; 8 }
html
1<!DOCTYPE html> 2<html lang="ja" xmlns:th="http://www.thymeleaf.org" 3 xmlns:sec="http://www.thymeleaf.org/extras/spring-security4"> 4<head> 5<meta charset="UTF-8"> 6<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 7<script src="/js/sampleJs.js" th:src="@{/js/baseSalary.js}"></script> 8</head> 9<body> 10 <table> 11 <tr><th>カラム1</th><th>カラム2</th><th>カラム3</th></tr> 12 <tr th:each="obj : ${baseSalaryList}"> 13 <td th:text="${obj.userId}"></td> 14 <td th:text="${obj.fullNm}"></td> 15 <td th:text="${obj.baseSalary}"></td> 16 </tr> 17 </table> 18</body> 19</html>
Ajaxからhtmlにlist型の値を渡して、
<table>
<tr><th>カラム1</th><th>カラム2</th><th>カラム3</th></tr>
<tr th:each="obj : ${baseSalaryList}">
<td th:text="${obj.userId}"></td>
<td th:text="${obj.fullNm}"></td>
<td th:text="${obj.baseSalary}"></td>
</tr>
</table>
こういう感じでtableは作れないものでしょうか
ご教授お願いいたします。
補足情報(FW/ツールのバージョンなど)
java8
SpringBoot2.0
jquery1.9.1
回答2件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2018/12/06 03:37