Spring Boot 2 Thymeleaf服务器端表单验证实现详解
这篇文章主要介绍了Spring Boot 2 Thymeleaf服务器端表单验证实现详解,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
表单验证分为前端验证和服务器端验证。
服务器端验证方面，Java提供了主要用于数据验证的JSR 303规范，而Hibernate Validator实现了JSR 303规范。
项目依赖加入spring-boot-starter-thymeleaf时，默认就会加入Hibernate Validator的依赖。
开发环境：IntelliJ IDEA 2019.2.2
Spring Boot版本：2.1.8
新建一个名称为demo的Spring Boot项目。
1、pom.xml
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-web</artifactId>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-devtools</artifactId>
</dependency>
2、src/main/java/com/example/demo/User.java
package com.example.demo;
import org.hibernate.validator.constraints.Length;
import javax.validation.constraints.NotBlank;
import javax.validation.constraints.Size;
public class User {
@NotBlank(message = "用户名不能为空")
String name;
@Length(min = 11, max = 11, message = "手机号长度必须11位")
String phone;
@Size(min = 6, max = 20, message = "密码长度6-20位")
String password;
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
public String getPhone() {
return phone;
}
public void setPhone(String phone) {
this.phone = phone;
}
public String getPassword() {
return password;
}
public void setPassword(String password) {
this.password = password;
}
}
3、src/main/java/com/example/demo/FormController.java
package com.example.demo;
import org.springframework.stereotype.Controller;
import org.springframework.validation.BindingResult;
import org.springframework.validation.ObjectError;
import org.springframework.web.bind.annotation.ModelAttribute;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import javax.validation.Valid;
import java.util.List;
@Controller
public class FormController {
@RequestMapping("/{form}")
public String form(@PathVariable String form, @ModelAttribute User user){
return form;
}
@PostMapping("/submit")
public String submit(@Valid User user, BindingResult result){
if (result.hasErrors()) {
List<ObjectError> list = result.getAllErrors();
for (ObjectError error : list) {
System.out.println(error.getDefaultMessage());
}
return "form";
}
//业务逻辑处理
return "form";
}
}
4、src/main/resources/templates/form.html
前端通过#fields对象输出错误信息有2种方式，1种是在每个字段后面输出，另1种是全部在一起输出。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>表单的提交处理</title>
<style>
.fieldError{color: red}
</style>
</head>
<body>
<form method="post" th:action="@{/submit}" th:object="${user}">
<table>
<tr>
<td>用户名：</td>
<td><input type="text" th:field="*{name}" />
<span class="fieldError" th:if="${#fields.hasErrors('*{name}')}" th:errors="*{name}"></span>
</td>
</tr>
<tr>
<td>手机号：</td>
<td><input type="text" th:field="*{phone}" />
<span class="fieldError" th:if="${#fields.hasErrors('*{phone}')}" th:errors="*{phone}"></span>
</td>
</tr>
<tr>
<td>密码：</td>
<td><input type="text" th:field="*{password}" />
<span class="fieldError" th:if="${#fields.hasErrors('*{password}')}" th:errors="*{password}"></span>
</td>
</tr>
<tr>
<td colspan="2">
<input type="submit" value="提交" />
<div th:each="err : ${#fields.errors('*')}">
<span th:text="${err}" class="fieldError"></span>
</div>
</td>
</tr>
</table>
</form>
</body>
</html>
启动服务后，浏览器访问http://localhost:8080/form，点击提交按钮，结果如下：
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。
相关推荐
-
spring boot thymeleaf 图片上传web项目根目录操作步骤
thymeleaf介绍 简单说, Thymeleaf 是一个跟 Velocity.FreeMarker 类似的模板引擎,它可以完全替代 JSP .相较与其他的模板引擎,它有如下三个极吸引人的特点: 1.Thymeleaf 在有网络和无网络的环境下皆可运行,即它可以让美工在浏览器查看页面的静态效果,也可以让程序员在服务器查看带数据的动态页面效果.这是由于它支持 html 原型,然后在 html 标签里增加额外的属性来达到模板+数据的展示方式.浏览器解释 html 时会忽略未定义的标签属性,所以 t
-
Spring Boot集成Thymeleaf模板引擎的完整步骤
简单介绍 目前在JavaEE领域有几中比较常用的模板引擎,分别是Jsp.Velocity.Freemarker.Thymeleaf,对Freemark语法不是特别熟悉,不过对于前端页面渲染效率来说,jsp其实还是最快的,Velocity次之.Thymeleaf虽然渲染效率不是很快,但是语法方面是比较轻巧的,Thymeleaf语法比Velocity轻巧,但是渲染效率不如Velocity thymeleaf 支持html5标准:是一种模板引擎框架(TemplateEngine Framework):
-
SpringBoot thymeleaf eclipse热部署方案操作步骤
网上找了好多的springboot热部署方案,也尝试了好几种方法,下面是我的成功方案跟大家分享 操作步骤 1.pom中添加热部署依赖 <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-devtools</artifactId> <optional>true</optional> </dependency&g
-
Spring Boot配置Thymeleaf（gradle）的简单使用
最近项目用到了Spring Boot ,但是在控制器返回html视图并渲染参数的时候,存在了疑问.后面考虑用Thymeleaf ,感觉真的不错,下面分享给大家 总共四步: jar 引入 控制器参数传递 html标签引入 Thymeleaf 缓存设置 一.相关Jar的引用 1.maven的引用方式: <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-
-
springboot如何使用thymeleaf模板访问html页面
引言 在传统的web开发中通常使用jsp页面,首先需要在pom文件中引入springmvc相关的包,然后写springmvc的配置文件(包括访问资源的路径解析),之后还需再web.xml中配置访问路由.这无疑太麻烦了,每次开发前都需要编写大量的配置文件. springboot为此提供了高效便捷的解决方案,只需再pom.xml中添加web开发的依赖,便可进行web开发,省去了繁琐的配置步骤. 下面为web开发引入的依赖 <dependency> <groupId>org.spring
-
SpringBoot引入Thymeleaf的实现方法
1.Thymeleaf简介 Thymeleaf是个XML/XHTML/HTML5模板引擎,可以用于Web与非Web应用 Thymeleaf的主要目标在于提供一种可被浏览器正确显示的.格式良好的模板创建方式,因此也可以用作静态建模,Thymeleaf的可扩展性也非常棒.你可以使用它定义自己的模板属性集合,这样就可以计算自定义表达式并使用自定义逻辑,Thymeleaf还可以作为模板引擎框架. 2.引入Thymeleaf 引入依赖 在maven(pom.xml)中直接引入: <dependency>
-
spring boot+thymeleaf+bootstrap实现后台管理系统界面
最近在学spring boot ,学习一个框架无非也就是使用它来做以前做的事情,两者比较才有不同,说一下自己使用的体会. 先来说下spring boot ,微框架.快速开发,相当于零配置,从一个大神那看来的说:spring boot 相当于框架的框架 ,就是集成了很多,用哪个添加哪个的依赖就行,这样的话自己看不到配置,对于习惯了使用配置刚使用spring boot的开发者来说可能还有点不习惯,什么都不用配,看不到配置感觉对项目整体架构有点陌生,再说在spring boot 中使用 thymele
-
Spring boot搭建web应用集成thymeleaf模板实现登陆
Spring boot 搭建web应用集成了thymeleaf模板实现登陆 下面是pom.xml的配置 <?xml version="1.0" encoding="UTF-8"?> <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schema
-
Spring Boot 2 Thymeleaf服务器端表单验证实现详解
这篇文章主要介绍了Spring Boot 2 Thymeleaf服务器端表单验证实现详解,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下 表单验证分为前端验证和服务器端验证. 服务器端验证方面,Java提供了主要用于数据验证的JSR 303规范,而Hibernate Validator实现了JSR 303规范. 项目依赖加入spring-boot-starter-thymeleaf时,默认就会加入Hibernate Validator的依赖. 开
-
Angular4表单验证代码详解
背景: 最近在itoo页面调整的时候,发现页面表单或者是文本框没有做基本的判断操作,所以着手demo一篇,希望对大家有帮助!! -------------------------------------------------------------------------------- 1.创建表单组件: ng g c login1 2.1单规则验证: <label>用户名:</label> <input type="text" #userNameRe
-
Angular表单验证实例详解
表单验证 我去,我感觉我这个人其实还是一个很傻逼的一个人,老是因为拼错了一个单词或者怎么样就浪费我很长时间,这样真的不行不行,要正确对待这个问题,好了,说正题吧,angular也有表单验证minlength,maxlength,required呀这些个东西,还有也支持h5的那些验证,h5的那些验证,就是type啦,type='email',number,url呀这些,然后现在要用angular来验证,可以定义样式哈,不错,然后怎么验证呢,好的上代码 <!DOCTYPE html> <ht
-
SpringMVC实现表单验证功能详解
本章节内容很丰富,主要有基本的表单操作,数据的格式化,数据的校验,以及提示信息的国际化等实用技能. 首先看效果图 项目结构图 接下来用代码重点学习SpringMVC的表单操作,数据格式化,数据校验以及错误提示信息国际化.请读者将重点放在UserController.java,User.java,input.jsp三个文件中. maven 项目必不可少的pom.xml文件.里面有该功能需要的所有jar包. <?xml version="1.0" encoding="UTF
-
Spring Boot学习入门之表单验证
前言 所谓表单验证,即校验用户提交的数据的合理性的,比如是否为空了,密码长度是否大于6位,是否是纯数字的,等等.spring boot是如何帮我们实现表单验证的呢?下面话不多说了,来一起看看详细的介绍吧. 假设现在我们存在这么一个注册界面: <!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <title>hello spring boot</title>
-
ASP.NET表单验证方法详解第1/2页
1.使用验证控件 这属于客户端验证,微软开发人员将最常用的验证功能进行了封装,使得我们开发效率明显提高,而且特别是自定义验证控件,非常灵活,我们可以自行设计验证逻辑.但是验证控件收到了浏览器的限制,记得在一次开发过程中,使用FireFox浏览器进行浏览,发现所有的验证控件失灵,这个并非是ASP.NET设计的漏洞,只能说浏览器标准的不唯一造成的. ASP.NET公有六种验证控件,分别如下: RequiredFieldValidator(必须字段验证) 用于检查是否有输入值 CompareValid
-
JQurey Validation表单验证使用详解
是一款优秀的插件,它能对客户端表单进行验证,并且提供了许多可以定制的属性和方法,良好的扩展性.本文就是通过讲解这个实例来理解Validation的应用. 本实例涉及到的验证有: 用户名:长度.字符验证,重复性ajax验证(是否已存在). 密码:长度验证,重复输入密码验证. 邮件:邮件地址验证. 固定电话:中国大陆固定电话号码验证. 手机号:中国大陆手机号码验证. 网址:网站URL地址验证. 日期:标准日期格式验证. 数字:整数.正整数验证,数字范围验证. 身份证:大陆身份证号码验证. 邮政编码:
-
JavaScript表单验证示例详解
HTML表单(form)通常用于收集用户信息,例如姓名,电子邮件地址,位置,年龄等. 但是很可能某些用户可能不会输入您期望的数据.HTML表单验证可以通过JavaScript完成. 为了避免对服务器资源造成不必要的压力,您可以使用JavaScript在客户端(用户系统)上验证表单数据,不正确的信息是不会提交给后台服务器的--这是所谓客户端验证.本文将介绍这种验证 表单验证一般分为两种方式. 客户端验证:直接在客户端执行JS进行验证,验证的过程中和服务器端没有任何的交互 服务器端验证:页面将验证信
-
jquery Validation表单验证使用详解
是一款优秀的插件,它能对客户端表单进行验证,并且提供了许多可以定制的属性和方法,良好的扩展性.本文就是通过讲解这个实例来理解Validation的应用. 本实例涉及到的验证有: 用户名:长度.字符验证,重复性ajax验证(是否已存在). 密码:长度验证,重复输入密码验证. 邮件:邮件地址验证. 固定电话:中国大陆固定电话号码验证. 手机号:中国大陆手机号码验证. 网址:网站URL地址验证. 日期:标准日期格式验证. 数字:整数.正整数验证,数字范围验证. 身份证:大陆身份证号码验证. 邮政编码:
-
AngularJs表单验证实例详解
常用的表单验证指令 1. 必填项验证 某个表单输入是否已填写,只要在输入字段元素上添加HTML5标记required即可: 复制代码 代码如下: <input type="text" required /> 2. 最小长度 验证表单输入的文本长度是否大于某个最小值,在输入字段上使用指令ng-minleng= "{number}": 复制代码 代码如下: <input type="text" ng-minlength="