by

Read Form Data in Spring Web MVC with @ModelAttribute

In this tutorial, you will learn how to read form data in your Spring MVC web application. To read form data in a method of the Controller class you can use the @ModelAttribute annotation.

HTML Form

Below is an example of an HTML form that submits form data to a /users URI path as an HTTP Post request.

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
<form action="/users" method="post" >
<div><input name="firstName" placeholder="First name"></div>
<div><input name="lastName" placeholder="Last name"></div>
<div><input name="email" placeholder="Email"></div>
<div><input name="password" placeholder="Password" type="password"></div>
<div><input name="repeatPassword" placeholder="Repeat password" type="password"></div>
<div><input type="Submit"></div>
</form>
<form action="/users" method="post" > <div><input name="firstName" placeholder="First name"></div> <div><input name="lastName" placeholder="Last name"></div> <div><input name="email" placeholder="Email"></div> <div><input name="password" placeholder="Password" type="password"></div> <div><input name="repeatPassword" placeholder="Repeat password" type="password"></div> <div><input type="Submit"></div> </form>
<form action="/users" method="post" >
    <div><input name="firstName" placeholder="First name"></div>
    <div><input name="lastName" placeholder="Last name"></div>
    <div><input name="email" placeholder="Email"></div>
    <div><input name="password" placeholder="Password" type="password"></div>
    <div><input name="repeatPassword" placeholder="Repeat password" type="password"></div>
    <div><input type="Submit"></div>
</form>

Reading Form Data

The @ModelAttribute annotation allows us to read the form data and bind it to a Java object. Additionally, it will also make this Java object available in the View as a Model.

Below is a very simple example of a method that uses @ModelAttribute annotation.

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
import com.appsdeveloperblog.tutorials.spring.mvc.estore.model.User;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.*;
@Controller
public class UsersController {
@PostMapping(path="/users")
public String signupFormSubmit(@ModelAttribute User user) {
return "signup-result";
}
}
import com.appsdeveloperblog.tutorials.spring.mvc.estore.model.User; import org.springframework.stereotype.Controller; import org.springframework.web.bind.annotation.*; @Controller public class UsersController { @PostMapping(path="/users") public String signupFormSubmit(@ModelAttribute User user) { return "signup-result"; } }
import com.appsdeveloperblog.tutorials.spring.mvc.estore.model.User;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.*;

@Controller
public class UsersController {

    @PostMapping(path="/users")
    public String signupFormSubmit(@ModelAttribute User user) {
        return "signup-result";
    }

}

User Class

When @ModelAttribute annotation is used, Spring Framework will bind each form field to a property in the Java object. For this to work, each form field name must match the property name in the Java class. In the above code snippet, the @ModelAttribute annotation will map form fields to property fields in the User class.

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
package com.appsdeveloperblog.tutorials.spring.mvc.estore.model;
public class User {
private String firstName;
private String lastName;
private String email;
private String password;
private String repeatPassword;
public String getFirstName() {
return firstName;
}
public void setFirstName(String firstName) {
this.firstName = firstName;
}
public String getLastName() {
return lastName;
}
public void setLastName(String lastName) {
this.lastName = lastName;
}
public String getEmail() {
return email;
}
public void setEmail(String email) {
this.email = email;
}
public String getPassword() {
return password;
}
public void setPassword(String password) {
this.password = password;
}
public String getRepeatPassword() {
return repeatPassword;
}
public void setRepeatPassword(String repeatPassword) {
this.repeatPassword = repeatPassword;
}
}
package com.appsdeveloperblog.tutorials.spring.mvc.estore.model; public class User { private String firstName; private String lastName; private String email; private String password; private String repeatPassword; public String getFirstName() { return firstName; } public void setFirstName(String firstName) { this.firstName = firstName; } public String getLastName() { return lastName; } public void setLastName(String lastName) { this.lastName = lastName; } public String getEmail() { return email; } public void setEmail(String email) { this.email = email; } public String getPassword() { return password; } public void setPassword(String password) { this.password = password; } public String getRepeatPassword() { return repeatPassword; } public void setRepeatPassword(String repeatPassword) { this.repeatPassword = repeatPassword; } }
package com.appsdeveloperblog.tutorials.spring.mvc.estore.model;

public class User {
    private String firstName;
    private String lastName;
    private String email;
    private String password;
    private String repeatPassword;

    public String getFirstName() {
        return firstName;
    }

    public void setFirstName(String firstName) {
        this.firstName = firstName;
    }

    public String getLastName() {
        return lastName;
    }

    public void setLastName(String lastName) {
        this.lastName = lastName;
    }

    public String getEmail() {
        return email;
    }

    public void setEmail(String email) {
        this.email = email;
    }

    public String getPassword() {
        return password;
    }

    public void setPassword(String password) {
        this.password = password;
    }

    public String getRepeatPassword() {
        return repeatPassword;
    }

    public void setRepeatPassword(String repeatPassword) {
        this.repeatPassword = repeatPassword;
    }
}

Displaying Form Data

@ModelAttribute annotation makes the object in the method argument available to the View automatically. Below is an example of HTML page that uses Thymeleaf template to access the User object and display its properties.

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
<!DOCTYPE html>
<html lang="en" xmlns:th="https://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Signup result</title>
</head>
<body>
<h1>Signup result</h1>
<p th:text="'First name: ' + ${user.firstName}" />
<p th:text="'Last name: ' + ${user.lastName}" />
<p th:text="'Email: ' + ${user.email}" />
</body>
</html>
<!DOCTYPE html> <html lang="en" xmlns:th="https://www.thymeleaf.org"> <head> <meta charset="UTF-8"> <title>Signup result</title> </head> <body> <h1>Signup result</h1> <p th:text="'First name: ' + ${user.firstName}" /> <p th:text="'Last name: ' + ${user.lastName}" /> <p th:text="'Email: ' + ${user.email}" /> </body> </html>
<!DOCTYPE html>
<html lang="en" xmlns:th="https://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Signup result</title>
</head>
<body>
<h1>Signup result</h1>
<p th:text="'First name: ' + ${user.firstName}" />
<p th:text="'Last name: ' + ${user.lastName}" />
<p th:text="'Email: ' + ${user.email}" />
</body>
</html>

Hopefully, this tutorial was helpful to you. To learn more about building Web applications with Spring Framework, please visit the Spring Web MVC category.

Happy learning!


Related Posts:

Powered by Contextual Related Posts