在Spring Boot MVC项目中使用Thymeleaf实现数据表时,数据表中没有任何数据填充
我的服务、控制器和视图是: 公共类LoadDataService{ } HTML页面中的数据表集成为:在Spring Boot MVC项目中使用Thymeleaf实现数据表时,数据表中没有任何数据填充,spring,spring-boot,spring-mvc,datatables,thymeleaf,Spring,Spring Boot,Spring Mvc,Datatables,Thymeleaf,我的服务、控制器和视图是: 公共类LoadDataService{ } HTML页面中的数据表集成为: 数据库演示 名称 任命 薪水 国家 $(文档).ready(函数(){ $('#示例')。数据表({ “搜索”:没错, “服务器端”:false, “分页”:正确, “sAjaxSource”:“${employeeList}”, “栏目”:[ {“数据”:“名称”}, {“数据”:“指定”}, {“数据”:“工资”}, {“数据”:“国家”} ] }) }); 尝试将员工列表分配给“数据
数据库演示
名称
任命
薪水
国家
$(文档).ready(函数(){
$('#示例')。数据表({
“搜索”:没错,
“服务器端”:false,
“分页”:正确,
“sAjaxSource”:“${employeeList}”,
“栏目”:[
{“数据”:“名称”},
{“数据”:“指定”},
{“数据”:“工资”},
{“数据”:“国家”}
]
})
});
尝试将员工列表分配给“数据”,如下所示:
<script th:inline="javascript">
var empList = ${employeeList};
$(document).ready(function () {
$('#example').DataTable({
"searching": true,
"serverSide":false,
"paging":true,
"data": empList,
"columns": [
{"data": "name"},
{"data": "designation"},
{"data": "salary"},
{"data": "country"}
]
})
});
</script>
var employist=${employeeList};
$(文档).ready(函数(){
$('#示例')。数据表({
“搜索”:没错,
“服务器端”:false,
“分页”:正确,
“数据”:雇主,
“栏目”:[
{“数据”:“名称”},
{“数据”:“指定”},
{“数据”:“工资”},
{“数据”:“国家”}
]
})
});
经过多次尝试和阅读大量问题后,我找到了答案
var employist=[#th:utext=“${employeeList}”/;
$(文档).ready(函数(){
控制台日志(empList);
$('#示例')。数据表({
“aaData”:雇主,
“aoColumns”:[
{“mDataProp”:“name”},
{“mDataProp”:“指定”},
{“mDataProp”:“salary”},
{“mDataProp”:“国家”}
]
})
});
sAjaxSource
采用的是URL而不是占位符。我如何将sAjaxSource与Thymeleaf中的employeelist映射仍不起作用!!我找到了更新后的答案,并在下面的帖子中发布。。谢谢:)
@RequestMapping(value = "/", method = RequestMethod.GET)
public ModelAndView home(Locale locale, Model model) throws JsonGenerationException, JsonMappingException, IOException {
logger.info("Welcome home! The client locale is {}.", locale);
LoadDataService dataService = new LoadDataService();
ObjectMapper mapper = new ObjectMapper();
ModelAndView mav=new ModelAndView();
mav.addObject("employeeList", mapper.writeValueAsString(dataService.getEmployeeList()));
mav.setViewName("index");
return mav;
}
<script th:inline="javascript">
var empList = ${employeeList};
$(document).ready(function () {
$('#example').DataTable({
"searching": true,
"serverSide":false,
"paging":true,
"data": empList,
"columns": [
{"data": "name"},
{"data": "designation"},
{"data": "salary"},
{"data": "country"}
]
})
});
</script>