1. 程式人生 > >springboot+thymeleaf之表單驗證

springboot+thymeleaf之表單驗證

本篇講述在spring boot框架中使用thymeleaf庫實現表單提交。

1 新建thymeleaf工程

使用IDEA的spring initialize嚮導新建spring boot工程,選擇庫web和thymeleaf,這樣生成的工程中的pom.xml中包含web和thymeleaf的依賴。並會在main/resouce下生成templates資料夾。

2 新建User實體,使用validator對資訊進行驗證

package com.example.formvalidate;

import org.hibernate.validator.constraints.Length;

import javax.validation.constraints.NotEmpty;

public class User {
    private int id;

    @NotEmpty(message="使用者名稱不能為空")
    private String username;

    @NotEmpty(message="密碼不能為空")
    @Length(min=6, message="密碼長度不能少於六位")
    private String password;

    public int getId() {
        return id;
    }
    public void setId(int id) {
        this.id = id;
    }
    public String getUsername() {
        return username;
    }
    public void setUsername(String username) {
        this.username = username;
    }
    public String getPassword() {
        return password;
    }
    public void setPassword(String password) {
        this.password = password;
    }
}

3 新建控制器LoginController

LoginContrller控制器包含有倆個Mapping註解,/index註解引導使用者到index.html,/login註解首先用@Valid捕捉錯誤資訊,然後列印登入結果資訊。

package com.example.formvalidate;

import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.validation.BindingResult;
import org.springframework.validation.ObjectError;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;

import javax.validation.Valid;
import java.util.List;

@Controller
public class LoginController {
    @RequestMapping(value="/index")
    public String index() {
        return "index";
    }
    @RequestMapping(value="/login")
    public @ResponseBody
    User login(@Valid User user, BindingResult result, Model model) {
        if (result.hasErrors()) {
            List<ObjectError> error = result.getAllErrors();
            for (ObjectError e : error) {
                System.out.println(e);
            }
            return null;
        }
        return user;
    }
}

4 在templates資料夾下新建index.html檔案

表單提交相應的頁面就是上面控制器中的/login路徑。

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8"/>
    <title>Insert title here</title>
</head>
<body>
<form action="login" method="post">
    <p>姓名:<input type="text" name="username"/>
    </p>
    <p>密碼:<input type="password" name="password"/>
    </p>
    <p><button>提交</button>
    </p>
</form>
</body>
</html>

5 測試

輸入使用者名稱,和密碼,使用者名稱不能為空,密碼不能少於6位,然後按提交,將會顯示:

如果使用者名稱或密碼驗證錯誤,將會在控制檯列印錯誤資訊。