Spring Boot入门(二十一) 之 员工列表的添加员工页面显示

简介: Spring Boot入门(二十一) 之 员工列表的添加员工页面显示

添加员工页面我们要进行修改,删除和添加这些操作,所以我们添加一些按钮如下:

表头位置添加一个操作选项

然后每一行的后边增加两个按钮,分别是编辑和删除

启动springboot来看

可以看到多了操作和删除按钮

然后我们再把Section title变成一个添加按钮


下面我们来实现添加功能,

我们给button添加一个a标签来实现跳转,路径改为/emp

然后在EmployeeController里边写上跳转到添加页面

我们在resources里边的emps里的list.html复制一份,然后改名为add.html

并把add.html里边的内容改了,先把main标签里边的内容删掉,然后换成下边的代码

<form>
  <div class="form-group">
    <label>LastName</label>
    <input type="text" name="lastName" class="form-control" placeholder="张三"/>
  </div>
  <div class="form-group">
    <label>Email</label>
    <input type="email" name="email" class="form-control" placeholder="zhangsan@example.com">
  </div>
  <div class="form-group">
    <label>Gender</label>
    <div class="form-check form-check-inline">
      <input class="form-check-input" type="radio" name="gender" value="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">
      <label class="form-check-label">女</label>
    </div>
  </div>
  <div class="form-group">
    <label>Department</label>
    <select class="form-control">
      <option>1</option>
      <option>2</option>
      <option>3</option>
      <option>4</option>
      <option>5</option>
    </select>
  </div>
  <div class="form-group" name="department.id">
    <label>Birth</label>
    <input name="birth" type="text" class="form-control" placeholder="zhangsan">
  </div>
  <button type="submit" class="btn btn-primary">添加</button>
</form>

这样我们点击添加就可以进入到添加页面

有关部门这一块,我们需要是从数据库中读取出来,所以当我们要添加员工的时候,就要把数据库里的部门读取出来,我们利用DepartmentDao来读出所有的部门,然后去选项里边遍历

利用th:each来读取所有的,放入option


可以看到这里是一个个的对象,所以我们直接取出departmentName


填完后当我们提交我们的表单的时候,option返回的其实是一个value属性,去进行数据库的查询比较,

到此我们的添加页面设计完成


相关文章
|
20天前
|
前端开发 Java 数据库
SpringBoot入门 - 对Hello world进行MVC分层
SpringBoot入门 - 对Hello world进行MVC分层
39 3
SpringBoot入门 - 对Hello world进行MVC分层
|
20天前
|
Java 数据库连接 测试技术
SpringBoot入门 - 添加内存数据库H2
SpringBoot入门 - 添加内存数据库H2
32 3
SpringBoot入门 - 添加内存数据库H2
|
14天前
|
Java 开发者 微服务
Spring Boot 入门:简化 Java Web 开发的强大工具
Spring Boot 是一个开源的 Java 基础框架,用于创建独立、生产级别的基于Spring框架的应用程序。它旨在简化Spring应用的初始搭建以及开发过程。
31 6
Spring Boot 入门:简化 Java Web 开发的强大工具
|
20天前
|
Java 应用服务中间件 数据库连接
SpringBoot入门 - SpringBoot HelloWorld
SpringBoot入门 - SpringBoot HelloWorld
SpringBoot入门 - SpringBoot HelloWorld
|
20天前
|
Java Spring
SpringBoot入门 - 定制自己的Banner
SpringBoot入门 - 定制自己的Banner
15 2
SpringBoot入门 - 定制自己的Banner
|
11天前
|
Java 数据库连接 数据库
从入门到精通---深入剖析Spring DAO
在Java企业级开发中,Spring框架以其强大的功能和灵活性,成为众多开发者的首选。Spring DAO(Data Access Object)作为Spring框架中处理数据访问的重要模块,对JDBC进行了抽象封装,极大地简化了数据访问异常的处理,并能统一管理JDBC事务。本文将从概述、功能点、背景、业务点、底层原理等多个方面深入剖析Spring DAO,并通过多个Java示例展示其应用实践,同时指出对应实践的优缺点。
17 1
|
15天前
|
监控 Java 数据安全/隐私保护
如何用Spring Boot实现拦截器:从入门到实践
如何用Spring Boot实现拦截器:从入门到实践
33 5
|
20天前
|
XML 安全 Java
SpringBoot入门 - SpringBoot简介
▶SpringBoot入门 - SpringBoot简介
|
2月前
|
人工智能 自然语言处理 前端开发
SpringBoot + 通义千问 + 自定义React组件:支持EventStream数据解析的技术实践
【10月更文挑战第7天】在现代Web开发中,集成多种技术栈以实现复杂的功能需求已成为常态。本文将详细介绍如何使用SpringBoot作为后端框架,结合阿里巴巴的通义千问(一个强大的自然语言处理服务),并通过自定义React组件来支持服务器发送事件(SSE, Server-Sent Events)的EventStream数据解析。这一组合不仅能够实现高效的实时通信,还能利用AI技术提升用户体验。
203 2
|
20天前
|
缓存 IDE Java
SpringBoot入门(7)- 配置热部署devtools工具
SpringBoot入门(7)- 配置热部署devtools工具
38 1
SpringBoot入门(7)- 配置热部署devtools工具