SpringBoot中thymeleaf显示数据举例

落日映苍穹つ 2022-03-14 15:04 303阅读 0赞

## 一.遍历数据举例 ##

1）、获取后端数据

//查询所有员工列表
        @GetMapping("/emps")
        public String list(Model mode){
            Collection<Employee> employees = employeeDao.getAll();
            mode.addAttribute("emps",employees);
            return "emp/list";
        }

2）、html遍历显示数据

<tr th:each="emp:${emps}">
        <td th:text="${emp.id}"></td>
        <td>[[emp.lastName]]</td>
        <td th:text="${emp.email}"></td>
        <td th:text="${emp.gender}==0?'女':'男'"></td>
        <td th:text="${emp.department.departmentName}"></td>
        <td th:text="${#dates.format(emp.birth,'yyyy-MM-dd HH:mm')}"></td>
        <td>
            <a  class="btn btn-sm btn-primary" th:href="@{/emp/}+${emp.id}">编辑</a>
            <button th:attr="del-uri=@{/emp/}+${emp.id} "  class="btn btn-sm btn-danger delete-btn">删除</button>
        </td>
    </tr>

## 一.保存/编辑共用举例 ##

<form th:action="@{/emp}" method="post">
        
        
        <input type="hidden" name="_method" value="put" th:if="${emp!=null}">
        <input type="hidden" name="id" value="" th:if="${emp!=null}" th:value="${emp.id}">
        <div class="form-group">
            <label>姓名</label>
            <input name="lastName" type="text" class="form-control" placeholder="zhangsan" th:value="${emp!=null}?${emp.lastName}">
        </div>
        <div class="form-group">
            <label>邮箱</label>
            <input name="email" type="email" class="form-control" placeholder="zhangsan@atguigu.com" th:value="${emp!=null}?${emp.email}">
        </div>
        <div class="form-group">
            <label>性别</label><br/>
            <div class="form-check form-check-inline">
                <input class="form-check-input" type="radio" name="gender"  value="1" th:checked="${emp!=null}?${emp.gender==1}">
                <label class="form-check-label">男</label>
            </div>
            <div class="form-check form-check-inline">
                <input class="form-check-input" type="radio" name="gender"  value="0" th:checked="${emp!=null}?${emp.gender==0}">
                <label class="form-check-label">女</label>
            </div>
        </div>
        <div class="form-group">
            <label>部门</label>
            <select class="form-control" name="department.id">
                <option th:each="dept:${depts}" th:text="${dept.departmentName}" th:value="${dept.id}" th:selected="${emp!=null}?${emp.department.id==dept.id}">1</option>
            </select>
        </div>
        <div class="form-group">
            <label>生日</label>
            <input name="birth" type="text" class="form-control" placeholder="zhangsan" th:value="${emp!=null}?${#dates.format(emp.birth,'yyyy-MM-dd HH:mm')}">
        </div>
        <button type="submit" class="btn btn-primary" th:text="${emp!=null}?'修改':'添加'">添加</button>
        <a class="btn  btn-dark" th:href="@{/emps}" role="button">取消</a>
    </form>

发表评论取消回复

表情：

评论列表（有 0 条评论，303人围观）

还没有评论，来说两句吧...

相关阅读

相关 SpringBoot+Thymeleaf+Jquery实现模态框的显示与数据填充

场景 ![Image 1][]![201905141632266.gif][] 实现 Html代码 <div th:fragment="conten

心已赠人/ 2023年10月18日 18:35/ 0 赞/ 13 阅读

相关 SpringBoot中对thymeleaf的时间进行格式化显示

场景对thymeleaf中时间进行格式化显示。实现 <div class="form-group col-md-4 ml_10"><label>创建

红太狼/ 2023年10月18日 18:34/ 0 赞/ 54 阅读

相关 SpringBoot+Thymeleaf+DataTables实现数据的查询与显示

场景效果： ![Image 1][]![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ib

深藏阁楼爱情的钟/ 2023年10月18日 17:30/ 0 赞/ 40 阅读

相关 SpringBoot中整合Thymeleaf

场景 springboot不建议使用jsp，使用模板引擎，比如thymeleaf，velocity，freemarker。项目搭建专栏： [https://blog

深藏阁楼爱情的钟/ 2023年10月18日 16:44/ 0 赞/ 104 阅读

相关 SpringBoot中使用Thymeleaf常用功能（三）：测试Thymeleaf循环取数据

搭建环境请参考文章一在index.html中新建超链接：<a th:href="@\{eachtest\}">测试循环</a> 新建包com.ysh.thymeleaft

超、凢脫俗/ 2023年10月17日 22:20/ 0 赞/ 13 阅读

相关 SpringBoot中使用thymeleaf模板

SpringBoot中使用thymeleaf模板 Thymeleaf是适用于Web和独立环境的现代服务器端Java模板引擎。Thymeleaf的主要目标是在开发工作中带来优雅

清疚/ 2023年01月19日 14:53/ 0 赞/ 31 阅读

相关 Thymeleaf怎么显示request中绑定的数据?

Thymeleaf怎么显示request中绑定的数据? 后端代码： @Controller public class test {

逃离我推掉我的手/ 2022年11月06日 05:57/ 0 赞/ 211 阅读

相关 Thymeleaf显示表格

Controller 获取用户请求，返回list //查询所有员工返回列表页面 @GetMapping("/emps") public Stri

向右看齐/ 2022年05月15日 13:35/ 0 赞/ 339 阅读

相关 SpringBoot中thymeleaf的使用

1、在pom.xml中导入thymeleaf  <dependency> <groupId>org

迷南。/ 2022年04月22日 22:50/ 0 赞/ 310 阅读

相关 SpringBoot中thymeleaf显示数据举例

一.遍历数据举例 1）、获取后端数据 //查询所有员工列表 @GetMapping("/emps") public String

落日映苍穹つ/ 2022年03月14日 15:04/ 0 赞/ 304 阅读