I can't pass a object Project without the object is null.
How do I pass the object to the spring controller from the html?
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Home</title>
</head>
<body>
<form action="/addproject" method="POST">
<input type="hidden" name="project" th:value="${project}"/>
<input type="submit" value="Save Project" class="submit">
</form>
</body>
</html>
#Controller
public class ProjectController {
#GetMapping("/")
public String indexPage(Model model) {
model.addAttribute("project", new Project("Test", "Test"));
return "index";
}
#PostMapping("/addproject")
public String add(WebRequest webRequest) {
Project p = (Project) webRequest.getAttribute("project", WebRequest.SCOPE_REQUEST);
return "index";
}
}
Please check this article. In short you need to pass required object to ModelAndView, not Model:
#GetMapping("/")
public ModelAndView indexPage(Model model) {
ModelAndView mav = new ModelAndView("index");
mav.addObject("project", new Project("Test", "Test"));
return mav;
}
and access it by name from template:
<b th:text="${project.attribute}">Text ...</b>
I would suggest you to proceed with the document here first.
You don't have a requirement or problem with ModelAndView.
The first time you call the /project page, the project class information will be loaded by #GetMapping, if you want, it will be captured by #PostMapping when you change and submit it.
project.html file:
<!DOCTYPE HTML>
<html xmlns:th="https://www.thymeleaf.org">
<head>
<title>Project Form</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body>
<h1>Project Form</h1>
<form method="post" th:action="#{/project}" th:object="${project}">
<p>Name: <input type="text" th:field="*{name}" /></p>
<p>Description: <input type="text" th:field="*{description}" /></p>
<p><input type="submit" value="Submit" /> </p>
</form>
</body>
</html>
Project.java file:
public class Project {
private String name;
private String description;
public Project(String name, String description) {
this.name = name;
this.description = description;
}
// getter/setter ...
}
ProjectController.java file:
#Controller
public class ProjectController {
#GetMapping("/project")
public String greetingForm(Model model) {
model.addAttribute("project", new Project("PN1", "PD1"));
return "project";
}
#PostMapping("/project")
public String greetingSubmit(#ModelAttribute Project project, Model model) {
model.addAttribute("project", project);
return "project";
}
}
Related
I am trying send the data through controller to html page but unable data transmission is getting failed. Control is redirecting to the desired page along with labels but form data is not reflecting in the view page.
***HomeController***
package com.example.demo.web;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.servlet.mvc.support.RedirectAttributes;
import com.example.demo.domain.User;
#Controller
public class HomeController {
User user = new User();
#RequestMapping("/")
public String home(Model model) {
model.addAttribute("formData", user);
return "index";
}
#RequestMapping(value="/create", method=RequestMethod.POST)
public String processFormData(User user, RedirectAttributes attr) {
attr.addFlashAttribute("user",user);
return "redirect:display";
}
#RequestMapping(value="/display", method=RequestMethod.GET)
public String displayFormData(User user) {
return "result";
}
}
index.html
<!DOCTYPE html>
<html xmlns:th="http://thymeleaf.org">
<head>
<meta charset="UTF-8">
<title> Home Page </title>
</head>
<body>
<p> Enter Data Below </p>
<form action="/create" method="post" th:object="${formData}">
<p>Full Name:<input type="text" th:feild="${formData.fullName}"/></p>
<p>Age:<input type="text" th:feild="${formData.age}"/></p>
<p>Employed?<input type="checkbox" th:feild="${formData.employed}" th:value="true"/></p>
<p>Gender:</p>
<p>Male<input type="radio" th:feild="${formData.gender}" th:value="Male"/>
Female<input type="radio" th:feild="${formData.gender}" th:value="Female"/></p>
<p><input type="submit" value="Submit"/> <input type="reset" value="Reset"/></p>
</form>
</body>
</html>
result.html
<html xmlns:th="https://thymeleaf.org">
<table>
<tr>
<td><h4>User Name: </h4></td>
<td><h4 th:text="${user.fullName}"></h4></td>
</tr>
<tr>
<td><h4>Age: </h4></td>
<td><h4 th:text="${user.age}"></h4></td>
</tr>
</table>
</html>
The controller class sends and reads a form view. The User data is passed as a parameter to the processForm() handler. Spring tries to fill the bean with the request data. The data is also automatically available for the Thymeleaf result view. The #Controller annotation allows the implementation classes to be autodetected through the classpath scanning.
#Controller is typically used in combination with a #RequestMapping annotation used on request handling methods. I used the #GetMapping and ##PostMapping` as a shortcut to #RequestMapping(method = RequestMethod.POST)
#Controller
public class HomeController {
//This responds to localhost:8080/
#GetMapping("/")
public String sendForm(User user){
return "index";
}
//This responds to localhost:8080/
#PostMapping("/")
public String processForm(User user){
return "result";
}
User Class. This is the User class. It is automatically filled with data from the form request. The attributes must match the form fields. You should be able to see the matching attribute names in the template views below.
public class User {
private String fullName;
private int age;
private String occupation;
public String getFullName() {
return fullName;
}
public void setFullName(String name) {
this.fullName = name;
}
public String getOccupation() {
return occupation;
}
public void setOccupation(String occupation) {
this.occupation = occupation;
}
public int getAge() {
return age;
}
public void setAge(int age) {
this.age = age;
}
}
index.html
The th:object refers to the user form bean. This is not a class name, but a Spring bean name; therefore it is in lowercase. With the *{} syntax, we refer to the defined object. In this case its the user object. I noticed that you misspelled th:field, this can also create bugs.
<!DOCTYPE html>
<html lang="en" xmlns:th="https://www.thymeleaf.org">
<head>
<meta charset="UTF-8"/>
<title></title>
</head>
<body>
<p> Enter Data Below </p>
<form th:action="#{/}" th:object="${user}" method="post">
<p>Full Name:<input type="text" th:field="*{fullName}" id="fullName" name="fullname" autofocus="autofocus"></p>
<p>Age:<input type="number" th:field="*{age}" id="age" name="age" autofocus="autofocus" /></p>
<p><input type="submit" value="Submit"/> <input type="reset" value="Reset"/></p>
</form>
</body>
</html>
result.html
We identify the form attributes with the ${} syntax.
<!DOCTYPE html>
<html lang="en" xmlns:th="https://www.thymeleaf.org">
<head>
<meta charset="UTF-8"/>
<title></title>
</head>
<body>
<table>
<tr>
<td><h4>User Name: </h4></td>
<td><h4 th:text="${user.fullName}"></h4></td>
</tr>
<tr>
<td><h4>Age: </h4></td>
<td><h4 th:text="${user.age}"></h4></td>
</tr>
</table>
</body>
</html>
I am new in web app development and I want to create a login page for my web app (using Spring boot + Thymeleaf), but I cannot display the form.html when I make a request for /form.
This is my Entity class:
package com.example.springboot.model;
public class ApplicationUser {
private String username;
private String password;
public ApplicationUser(String username, String password) {
this.username = username;
this.password = password;
}
public ApplicationUser() { }
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;
}
}
My form.html looks like this:
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Form Submission</title>
</head>
<body>
<h1>User form</h1>
<form action="#" th:action="#{/form}" th:object="${applicationuser}" method="post">
<p>Username: <input type="text" th:field="*{username}"/></p>
<p>Password: <input type="text" th:field="*{password}"/></p>
<p><input type="submit" value="Send"/></p>
</form>
</body>
</html>
And the result.html is
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Result</title>
</head>
<body>
<h1>Result</h1>
<p th:text="'username: ' + ${applicationuser.username}"/>
<p th:text="'password: ' + ${applicationuser.password}"/>
Submit another
</body>
</html>
But applicationuser from th:object="${applicationuser}" is highlighted in red ("cannot resolve "applicationuser"). Can this be a problem? How to resolve it?
My Controller class is
#RestController
public class Test {
#RequestMapping(value = "/form",method = RequestMethod.GET)
public String userForm(Model model){
model.addAttribute("applicationuser",new ApplicationUser());
return "form";
}
#RequestMapping(value = "/form",method = RequestMethod.POST)
public String userSubmit(#ModelAttribute ApplicationUser user,Model model){
model.addAttribute("applicationuser",user);
String info = String.format("User Submission: username = %s, password = %s", user.getUsername(),user.getPassword());
System.out.println(info);
return "result";
}
}
I'm just trying to get input form and display them in console, but no way...
When I make a request in my browser: http://localhost:8080/form I obtain a white page with follow string "form", it doesn't display the textfields and button.
I have in pom.xml the thymeleaf dependency:
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
Does anyone known what is the problem with my code?
Seems i got your problem. Change this section
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
to
<html xmlns:th="http://www.w3.org/1999/xhtml" xmlns:sf="http://www.w3.org/1999/xhtml" lang="en">
And change your
<p>Username: <input type="text" th:field="*{username}"/></p>
<p>Password: <input type="text" th:field="*{password}"/></p>
to
<p>Username: <input type="text" id="username" name="username"/></p>
<p>Password: <input type="text" id="password" name="password" /></p>
One more thing, Change you #RestController to #Controller
If it works, let me know.
I'm trying to create a simple login page using Spring.
I've created a form as described in the tutorial [here][1]
For some reason, when I hit the submit button, the request doesn't go through to the controller. (I've set a breakpoint in the first line of the controllers method)
Does anyone have an idea why?
My code:
Controller:
#RequestMapping(value="/login", method=RequestMethod.POST)
public String login(#ModelAttribute(value="loginModel") LoginModel loginModel) {
if(loginModel.getEmail().equals("null") || loginModel.getPassword().equals("null")) {
return "Wrong user email or password";
}
return "result";
}
Model:
public class LoginModel {
private String email;
private String password;
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 LoginModel(String email, String password) {
super();
this.email = email;
this.password = password;
}
}
View:
<!doctype html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link rel="stylesheet" href="css/login.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
</head>
<body>
<div class="form">
<ul class="tab-group">
<li class="tab active">Sign Up</li>
<li class="tab">Log In</li>
</ul>
<div id="login">
<h1>Welcome Back!</h1>
<form action="#" th:action="#{/login}" th:object="${loginModel}" method="post">
<div class="field-wrap">
<input type="email" required autocomplete="off" th:field="*{email}"/>
</div>
<div class="field-wrap">
<input type="password" required autocomplete="off" th:field="*{password}"/>
</div>
<p class="forgot">
Forgot Password?
</p>
<input type="submit" value="Log in" />
</form>
</div>
</div>
</body>
</html>
UPDATE:
Found the problem...
The LoginModel class MUST have empty constructor
Remove #ModelAttribute and then try again.
I am trying to receive all the request parameters from a form in controller having a modelobj. But the model parameters remains null. I dont want to create all the parameters and their setter/getters of models in my controller class...Plz help
Form :
<%# page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<%# taglib uri="/struts-tags" prefix="s"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Login</title>
</head>
<body>
<div>
<form action="login" method="post">
<label>Email Id</label>
<input type="text" name="emailId">
<label>Password</label>
<input type="password" name="password">
<input type="submit" value="Login">
</form>
</div>
</body>
</html>
Model :
public class UserModel {
String emailId;
String password;
public String getEmailId() {
return emailId;
}
public void setEmailId(String emailId) {
this.emailId = emailId;
}
public String getPassword() {
return password;
}
public void setPassword(String password) {
this.password = password;
}
}
Controller :
import com.opensymphony.xwork2.ActionSupport;
public class LoginController extends ActionSupport{
UserModel userModelObj = new UserModel();
public UserModel getUserModelObj() {
return userModelObj;
}
public void setUserModelObj(UserModel userModelObj) {
this.userModelObj = userModelObj;
}
public String login()
{
UserModel userModelObj = new UserModel();
System.out.println(userModelObj.emailId);
System.out.println(userModelObj.password);
return "success";
}
}
On console it returns null null
You must use your bean class reference in your form's name attribute like this :
<div>
<form action="login" method="post">
<label>Email Id</label>
<input type="text" name="userModelObj.emailId"/>
<label>Password</label>
<input type="password" name="userModelObj.password"/>
<input type="submit" value="Login">
</form>
</div>
Otherwise use the concept Of ModelDriven interface.
Can anyone give sample Java code for validating the HTML form (ex: form attributes not null, minimum and maximum size) using via Spring MVC and with thymeleaf-spring4 libraries?
The simplest, you annotate your dao object (in this case user), with the constraints you need:
#Entity
public class User
{
#Id
#GeneratedValue(strategy = GenerationType.AUTO)
private long id;
#NotNull
private String login;
#Size(min=2, max=30)
private String firstName;
#Min(18)
private int age;
}
These annotation are from javax.validation.constraints.
After this you need to modify your controller, you need to clarify your controller that the object must be #Valid:
#RequestMapping(method=RequestMethod.POST)
public String registerUser(#Valid final User user, final BindingResult bindingResult)
{
if (bindingResult.hasErrors()) {
return "form";
}
// Your code
return "redirect:/userList";
}
The errors are stored in the BindingResult.
Finally show the errors:
<span th:if="${#fields.hasErrors('login')}" th:errors="*{login}"></span>
Edit:
Return ModelAndView
#RequestMapping(method=RequestMethod.POST)
public ModelAndView registerUser(#Valid final User user, final BindingResult bindingResult)
{
if (bindingResult.hasErrors()) {
ModelAndView mav = new ModelAndView("form");
mav.addObject(bindingResult);
return mav;
}
}
These are latest maven dependencies for java validation API
1.dependency
groupId javax.validation
artifactId validation-api
version 1.1.0.Final
2.dependency
groupId org.hibernate
artifactId hibernate-validator
version 5.0.1.Final
Take a look at this:
First, comes the Object...
public class PruebaFormCommand {
#NotEmpty
#Size(min = 3, max = 50)
private String textoPrueba;
public String getTextoPrueba() {
return textoPrueba;
}
public void setTextoPrueba(String textoPrueba) {
this.textoPrueba = textoPrueba;
}
}
Then, the Controller:
#Controller
public class PruebaFormController {
#RequestMapping("/pruebaform")
public String pruebaForm(Model model){
model.addAttribute("pruebaFormCommand", new PruebaFormCommand());
return "pruebaform";
}
#RequestMapping(value = "/dopruebaform", method = RequestMethod.POST)
public String doPruebaForm(#Valid PruebaFormCommand pruebaFormCommand, BindingResult bindingResult){
if (bindingResult.hasErrors()) {
return "pruebaform";
}
return "pruebaformcomplete";
}
}
Then, the HTML:
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8"/>
<link href="../static/css/bootstrap-3.3.4-dist/css/bootstrap.min.css" rel="stylesheet" media="screen"
th:href="#{/css/bootstrap-3.3.4-dist/css/bootstrap.min.css}"/>
<script src="../static/js/jquery-2.1.4.min.js"
th:src="#{/js/jquery-2.1.4.min.js}"></script>
<link th:href="#{/css/custom.css}" rel="stylesheet" media="screen"/>
<title>Checkout</title>
</head>
<body>
<div class="container">
<h2>PRUEBA Form</h2>
<form class="form-horizontal" th:object="${pruebaFormCommand}" th:action="#{/dopruebaform}" method="post">
<div th:if="${#fields.hasErrors('*')}" class="alert alert-danger">
<p th:text="#{pruebaFormCommand.hasErrors}">Error Message</p>
</div>
<div class="form-group" th:class="${#fields.hasErrors('textoPrueba')} ? 'form-group has-error' : 'form-group'">
<label class="col-sm-2 control-label">Meteme algo payo:</label>
<div class="col-sm-10">
<input type="text" class="form-control" th:field="*{textoPrueba}" th:errorclass="has-error"/>
<span class="help-block" th:if="${#fields.hasErrors('textoPrueba')}">
<ul>
<li th:each="err : ${#fields.errors('textoPrueba')}" th:text="${err}" />
</ul>
</span>
</div>
</div>
<div class="row">
<button type="submit" class="btn btn-default">Submit</button>
</div>
</form>
</div>
</body>
</html>
Finally, include your message.properties:
pruebaFormCommand.hasErrors=Porfa corrige los errores:
NotEmpty.pruebaFormCommand.textoPrueba={0} caracteres mÃnimo....
Size.pruebaFormCommand.textoPrueba={0} debe tener entre {2} y {1} caracteres