Skip to main content

Forms Development Using Spring Web MVC

Sending Data From Controller To UI

+++++++++++++++++++++++++++

-> We can send data from controller to UI in multiple ways.

1) ModelAndView

2) Model

3) @ResponseBody  //We can say It use as Api in Angular, React js



-> Forms are very important in every web application..

-> Forms are used to collect data from the user.

Ex: Login form, Registration form, Search Forms etc....

-> Spring Web MVC provided form tag library to develop forms easily.

-> Spring Form Tag Library contains several Tags.

<form:form >

<form:input >

<form:password>

<form:radioButton> & <form:radioButtons>

<form:select>

<form:option> & <form:options>

<form:checkbox> & <form:checkboxes>

<form:hidden>

<form:error>

-> Spring Web MVC support Form Binding that means it can bind form data to object and vice versa.

Note: In servlets we use request.getParameter("key") to capture form data.

-> In Spring Web MVC we no need to use request.getParameter("") to capture form data bcz Web MVC having Form Binding Support.

-> To achieve Form Binding we need to create a binding class .

    (class variables will be mapped with form fields)

-> To work with Spring Form Tag library we need to use below taglib directive.

<%@ taglib uri="http://www.springframework.org/tags/form" prefix="form" %>   

++++++++++++++++++++++++++++++++++

Steps to build first form based application

++++++++++++++++++++++++++++++++++

1) Create boot app with below dependencies

a) web-starter

b) devtools

c) lombok

d) tomcat-embed-jasper

2) Create Form Binding class

3) Create a controller class with required methods

a) method to display empty form (GET Request Method)

b) method to handle form submission (POST Request Method)

4) Create View Page with presentation logic

5) configure view resolver in application.properties file

----------------------------------------------------

@Data

public class Product {

private Integer productId;

           private String productName;

           private Double productPrice;

}

------------------------------------------------

@Controller

public class ProductController {

@GetMapping("/")

public String getProductForm(Model model) {

Product productObj = new Product();

model.addAttribute("product", productObj);

return "index";

}

@PostMapping("/product")

public String handleFormSubmit(Product product, Model model) {

System.out.println(product);

model.addAttribute("msg", "Product Saved Successfully");

return "success";

}

}

------------------------------------------------------------

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"

pageEncoding="ISO-8859-1"%>

<%@ taglib uri="http://www.springframework.org/tags/form" prefix="form"%>

<!DOCTYPE html>

<html>

<head>

<meta charset="ISO-8859-1">

<title>Insert title here</title>

</head>

<body>

<h3>Save Product Data</h3>

<form:form action="product" modelAttribute="product" method="POST">

<table>

<tr>

<td>Product ID</td>

<td><form:input path="productId" /></td>

</tr>

<tr>

<td>Product Name</td>

<td><form:input path="productName" /></td>

</tr>

<tr>

<td>Product Price</td>

<td><form:input path="productPrice" /></td>

</tr>

<tr>

<td><input type="submit" value="Submit" /></td>

</tr>

</table>

</form:form>

</body>

</html>

-----------------------------------------------------------------------------

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"

pageEncoding="ISO-8859-1"%>

<!DOCTYPE html>

<html>

<head>

<meta charset="ISO-8859-1">

<title>Insert title here</title>

</head>

<body>

<h2>${msg}</h2>

<a href="/">Go Home</a>

</body>

</html>

-------------------------------------------------------------------------

Form Validations

++++++++++++++++

-> Forms are used to capture data from the user.

-> To make sure users are entering valid data we will form validations on the data.

-> Spring Web MVC having support to perform form validations....

@NotEmpty

@NotNull

@Size

@Min

@Max

------------------------------------------------------------

-> We need to below dependency in pom.xml to perform form validations

<dependency>

<groupId>org.springframework.boot</groupId>

<artifactId>spring-boot-starter-validation</artifactId>

</dependency>

---------------------------------------------------

@Data

public class User {

@NotEmpty(message = "Uname is required")

@Size(min = 3, max = 8, message = "Uname should be 3 to 8 characters")

private String uname;


@NotEmpty(message = "Pwd is required")

private String pwd;


@NotEmpty(message = "Email is required")

@Email(message = "Enter valid email id")

private String email;


@NotEmpty(message = "Phno is required")

@Size(min = 10, message = "Phno should have atleast 10 digits")

private String phno;


@NotNull(message = "Age is required")

@Min(value = 21, message = "Age should be minimum 21 years")

@Max(value = 60, message = "Age shouldn't cross 60 years")

private Integer age;

}

-------------------------------------

@Controller

public class UserController {

@GetMapping("/")

public String getForm(Model model) {

User userObj = new User();

model.addAttribute("user", userObj);

return "index";

}

@PostMapping("/register")

public String handleRegisterBtn(@Valid User userForm, BindingResult result, Model model) {

if(result.hasErrors()) {

return "index";

}

System.out.println(userForm);

//logic to store form data in db

model.addAttribute("msg", "Your Registration Successful...!!");

return "success";

}

}

--------------------------------------

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"

pageEncoding="ISO-8859-1"%>

<%@ taglib uri="http://www.springframework.org/tags/form" prefix="form"%>

<!DOCTYPE html>

<html>

<head>

<meta charset="ISO-8859-1">

<title>Insert title here</title>

<style>

.error {

color: red

}

</style>

</head>

<body

<h3>User Registration Form</h3>

<form:form action="register" modelAttribute="user" method="POST">

<table>

<tr>

<td>Username</td>

<td><form:input path="uname" /> <form:errors path="uname" cssClass="error"/></td>

</tr>

<tr>

<td>Pwd</td>

<td><form:password path="pwd" /> <form:errors path="pwd" cssClass="error"/></td>

</tr>

<tr>

<td>Email</td>

<td><form:input path="email" /> <form:errors path="email" cssClass="error"/></td>

</tr>

<tr>

<td>Phno</td>

<td><form:input path="phno" /> <form:errors path="phno" cssClass="error"/> </td>

</tr>

<tr>

<td>Age</td>

<td><form:input path="age" /> <form:errors path="age" cssClass="error"/> </td>

</tr>

<tr>

<td></td>

<td><input type="submit" value="Register" /></td>

</tr>

</table>

</form:form>

</body>

</html>

------------------------------------------------------

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"

pageEncoding="ISO-8859-1"%>

<!DOCTYPE html>

<html>

<head>

<meta charset="ISO-8859-1">

<title>Insert title here</title>

</head>

<body>

<h2>${msg}</h2>

<a href="/">Home</a>

</body>

</html>

-----------------------------------------------------



Comments

© 2020 The JavaDS Hub

Designed by Open Themes & Nahuatl.mx.