I'm sort-of shocked that I can't find an example of how to do this. Every time I google it, I get info on how to post a collection of objects, or other unrelated stuff. The thymeleaf documentation (what I can find of it) seems to not explain much either, like there is a lot of assumed knowledge.
Getting back to my question, I just want to post a single object (bean) from a form. I would like my controller mapping method to bind to this "pojo" bean and not to a bunch of strings/integers.
The only thing that I have found that comes close is stuff on StackOverflow where half of the code is in the question, the other half is in the answer, and there are always a few comments from people saying it didn't work for them.
Can anyone offer any relief here with a plain old boring example?
Can find the below code snippet might helpful for you.
Controller GET/POST mapping:
#RequestMapping(value = "/registration", method = RequestMethod.GET)
public String registartionPage(Model model) {
Registration registration = new Registration();
model.addAttribute("registration", registration);
return "registarion/registarion";
}
#RequestMapping(value = "/user/new-user-registrn", method = RequestMethod.POST)
public String newUserRegistrn(Model model, #ModelAttribute("registration")
Registration registration, RedirectAttributes redirectAttributes) {
try {
StarUser user = starSecurityService.findSysUserName(registration.getUserName());
if (user != null) {
throw new Exception("User Already Exist. Please try with different User Name");
}
user = (StarUser) starUtilService.save(setStarUser(registration));
model.addAttribute("registration", registration);
if (user != null) {
redirectAttributes.addAttribute("starMessage",
"Your Account is successfully created !! Login to Access the Application");
return "redirect:/";
}
} catch (Exception e) {
model.addAttribute(STAR_MESSAGE, e.getMessage());
}
return "registarion/registarion";
}
Thymeleaf Content:
<form class="form-horizontal col-sm-12" method="POST" th:action="#{/user/new-user-registrn}" th:object="${registration}">
<div class="row">
<div class="form-group col-md-12">
<div class="star-reg-header">New User Registration</div>
</div>
<div class="star-reg-body">
<div class="form-group col-sm-4">
<label class="required">First Name: </label>
<input type="text" class="form-control required" th:field="*{firstName}" required="required" />
</div>
<div class="form-group col-sm-4">
<label class="required">Last Name: </label>
<input type="text" class="form-control" th:field="*{lastName}" required="required" />
</div>
<div class="form-group col-sm-4">
<label class="required">User Name: </label>
<input type="text" class="form-control" th:field="*{userName}" required="required" />
</div>
<div class="form-group col-sm-4">
<label class="required">Password: </label>
<input type="password" class="form-control" th:field="*{password}" required="required" />
</div>
<div class="form-group col-sm-4">
<label class="required">Email: </label>
<input type="text" class="form-control" th:field="*{email}" required="required" />
</div>
</div>
</div>
<div class="form-group col-md-12">
<label class="col-sm-2"></label>
<div class="col-sm-10">
<button type="submit" class="btn btn-info">Submit</button>
</div>
</div>
Java Bean class
public class Registration {
protected String firstName;
protected String lastName;
protected String userName;
protected String password;
protected String email;
//Setter and Getter
}
Use #ModelAttribute annotation in the parameter.
Something like this.
#RequestMapping(value = "/someurl", method = RequestMethod.POST)
public String savePojo(#ModelAttribute PojoClass pojo, Model model) {
//Code
}
Edit: This answer has very good info on this.
What is #ModelAttribute in Spring MVC?
Related
I'm trying to implement a login form in a Spring boot application. It has an email and a password field. The email field failed to get user input, here is the form:
<form th:action="#{/login}" method="get" th:object="${loginForm}" style="max-width: 600px; margin: 0 auto;">
<div class="m-3">
<div class="form-group row">
<label class="col-4 col-form-label">E-mail: </label>
<div class="col-8">
<input type="text" th:field="*{email}" name="q" class="form-control" required />
</div>
</div>
<div class="form-group row">
<label class="col-4 col-form-label">Password: </label>
<div class="col-8">
<input type="password" th:field="*{password}" class="form-control" required/>
</div>
</div>
<div>
<button type="submit" class="btn btn-primary">Log in</button>
</div>
</div>
</form>
Here is the controller:
#GetMapping("login")
public ModelAndView login(Model model, #RequestParam(name = "q", required = false) Optional<String> email) {
Optional<UserDto> aUser;
System.out.println(email);
if (email.isPresent()) {
aUser = userService.getAUserByEmail(email.get());
model.addAttribute("user", aUser);
var mv = new ModelAndView("user/user-list", model.asMap());
return mv;
} else {
model.addAttribute("loginForm", new LoginForm());
return new ModelAndView("/login/login-form", model.asMap());
}
}
I thought the #RequestParam(name = "q") and name="q" in html would do the job, but I always get Optional.empty for email. Any idea what's wrong here?
UPDATE:
From the answers I changed controller to this:
#GetMapping("login")
public ModelAndView login(Model model, LoginForm loginForm) {
Optional<UserDto> aUser;
if (loginForm.getEmail() != null) {
aUser = userService.getAUserByEmail(loginForm.getEmail());
model.addAttribute("user", aUser);
var mv = new ModelAndView("user/user-list", model.asMap());
return mv;
} else {
model.addAttribute("loginForm", new LoginForm());
return new ModelAndView("/login/login-form", model.asMap());
}
}
login-form.html to this:
<form th:action="#{/login}" method="get" th:object="${loginForm}" style="max-width: 600px; margin: 0 auto;">
<div class="m-3">
<div class="form-group row">
<label class="col-4 col-form-label">E-mail: </label>
<div class="col-8">
<input type="text" th:field="*{email}" class="form-control" required />
</div>
</div>
<div class="form-group row">
<label class="col-4 col-form-label">Password: </label>
<div class="col-8">
<input type="password" th:field="*{password}" class="form-control" required/>
</div>
</div>
<div>
<button type="submit" class="btn btn-primary">Log in</button>
</div>
</div>
</form>
I also have LoginForm.java like this
#Data
#AllArgsConstructor
#NoArgsConstructor
public class LoginForm {
private String email;
private String password;
}
but still not getting user email field input?
The way you have set up your form, it's mapping the value of your email input field to the property email (that's what th:field="*{email}" means) of an object called loginForm (that's what th:object="${loginForm}" means). Neither of these seem to be used or even exist in your login() method. You need to either change what you use in your controller to match what you have in your Thymeleaf template, or change your Thymeleaf template to actually reference what you are using in your controller.
The problem in your code is located under th:object="${loginForm}"
With this you inform spring to bind the data sent from the form into an object named loginForm.
So Spring actually expects the controller to be
#GetMapping("login")
public ModelAndView login(Model model, LoginForm loginForm) {
....
and inside LoginForm a field named email will contain the value sent from the form, as you have declared with <input type="text" th:field="*{email}" .... >
If you don't want the data to be bound into an object from Spring Mvc then
remove the th:object="${loginForm}"
use the
<input type="text" th:name="q" class="form-control" required />
and then the controller will receive the sent value as a query parameter
#GetMapping("login")
public ModelAndView login(Model model, #RequestParam(name =
"q", required = false) Optional<String> email) {
When I use jQuery's $.ajax() or $.post() method to send form information to server, the 'data' string is added to the end of the url. Why the POST request becomes a GET request? The form code shown below
<form role="form" class="form-horizontal">
<div class="box-body">
<div class="form-group">
<label for="name" class="col-sm-2 control-label">Name</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="name" name="name" required>
</div>
</div>
<div class="form-group">
<label for="hospital" class="col-sm-2 control-label">Hospital</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="hospital" name="hospital" required>
</div>
</div>
<div class="form-group">
<label for="url" class="col-sm-2 control-label">URL</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="url" name="url" required>
</div>
</div>
<div class="form-group">
<label for="version" class="col-sm-2 control-label">Version</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="version" name="version" required>
</div>
</div>
<div class="form-group">
<label for="description" class="col-sm-2 control-label">Description</label>
<div class="col-sm-10">
<textarea class="form-control" id="description" name="description" rows="3" required></textarea>
</div>
</div>
</div>
<div class="box-footer text-center">
<button type="reset" class="btn btn-default">Reset</button>
<button type="submit" class="btn btn-primary" id="submitBtn">Submit</button>
</div>
</form>
Ajax code
$("#submitBtn").submit(function(event) {
event.preventDefault();
var info = {};
info.name = $("#name").val();
info.hospital = $("#hospital").val();
info.url = $("#url").val();
info.version = $("#version").val();
info.description = $("#description").val();
$.post("/nuts/add", JSON.stringify(info), function(data) {
console.log(data);
}, "json");
}
The url always like this
http://localhost:8080/nuts/add.html?name=1&hospital=1&url=1&version=1&description=1
My backend framework is Spring MVC, and the controller code shown below
#RestController
#RequestMapping(value = "/nuts/add", produces = {APPLICATION_JSON_VALUE})
public class AddNutsApi {
private MongoBasicDao<Nuts> mongoBasicDao;
#Autowired
public void setMongoBasicDao(MongoBasicDao<Nuts> mongoBasicDao) {
this.mongoBasicDao = mongoBasicDao;
}
#RequestMapping(value = "", produces = {APPLICATION_JSON_VALUE}, method = RequestMethod.POST)
public ResponseEntity<Void> addNutsPost(#RequestBody Nuts nuts) throws NotFoundException {
if (nuts.getName() != null && nuts.getHospital() != null && nuts.getUrl() != null && nuts.getVersion() != null && nuts.getDescription() != null) {
try {
Nuts _nuts = new Nuts();
_nuts.setName(new String(nuts.getName().getBytes("ISO-8859-1"), "UTF-8"));
_nuts.setHospital(new String(nuts.getHospital().getBytes("ISO-8859-1"), "UTF-8"));
_nuts.setUrl(new String(nuts.getUrl().getBytes("ISO-8859-1"), "UTF-8"));
_nuts.setVersion(new String(nuts.getVersion().getBytes("ISO-8859-1"), "UTF-8"));
_nuts.setDescription(new String(nuts.getDescription().getBytes("ISO-8859-1"), "UTF-8"));
_nuts.setCreationTime(new Date());
Integer mark = mongoBasicDao.getCollectionMark(Constant.COLLECTION_NUTS);
_nuts.setMark(mark);
mongoBasicDao.addObject(_nuts, Constant.COLLECTION_NUTS);
return new ResponseEntity<>(HttpStatus.OK);
} catch (Exception e) {
return new ResponseEntity<>(HttpStatus.BAD_REQUEST);
}
} else {
return new ResponseEntity<>(HttpStatus.BAD_REQUEST);
}
}
}
I have added jackson's dependency(jackson-databind), and set the <mvc:annotation-driven/> in the Spring MVC configuration file. By the way, the DispatcherServlet's url-pattern is / .
Can anyone tell me where am I getting it wrong? Thanks a lot!
When you call JSON.stringify(info), you will get a JSON string , e.g. something like this:
{ "name": "1", "hospital": "1", "url": "1", "version": "1", "description": "1" }
You certainly will not get a query string like this:
?name=1&hospital=1&url=1&version=1&description=1
That should be your hint that the JavaScript code is not responsible for the GET request you see.
The problem is that you're binding the submit function wrong. $("#submitBtn").submit(...) doesn't do anything, because a <button type="submit"> doesn't fire any submit events. The <form> does.
What happens is that the JavaScript code is ignored, and clicking the Submit button will trigger a submit of the form, and since the <form> element doesn't have a method="post" attribute, the form will be submitted as a GET.
Solution: Bind the submit(...) to the <form>.
Hello I am developing a CMS using Spring and Hibernate. I have a page displaying existing products and a form which should add a new product to the database. However when I fill out the form and submit it nothing gets saved to the database. Additionally System.out.println does not print anything to the console so I have no idea where is the problem.
jsp page
<form:form class="form-horizontal" method="post" modelAttribute="productForm">
<div class="form-group">
<label class="col-sm-2 control-label"> Product Name:</label>
<div class="col-sm-10">
<form:input class="form-control" type="text" id="productName" name="product name" path="name" />
<br></div></div>
<div class="form-group">
<label class="col-sm-2 control-label"> Serial number:</label>
<div class="col-sm-10">
<form:input class="form-control" type="text" id="productSerial" name="serial number" path="serial" value=" " /></div></div>
<input type="submit" value="Submit">
</form:form>
controller
#RequestMapping(value = "/saveNewContact", method = RequestMethod.POST)
public ModelAndView saveContact(#ModelAttribute("userForm") Product product,
BindingResult result, Model model) {
System.out.println(product);
productService.saveOrUpdate(product);
return new ModelAndView("redirect:/");
}
Service
#Override
public void saveProduct(Product product) {
productDao.saveProduct(product);
}
DAO
the interface implementation has #Transactional(readOnly = false)
public void saveNewProduct(Product product) {
persist(product);
}
The problem was in the form just adding action="saveNewContact" fixed the issue.
Here's my controller
#RequestMapping(value = "/save",method = RequestMethod.POST)
public ModelAndView saveUserAccount(#ModelAttribute("account") UserAccountForm userAccount, BindingResult result){
AddUserValidator userValidator = new AddUserValidator();
userValidator.validate(userAccount,result);
boolean hasErrors = result.hasErrors();
if(hasErrors){
return render(ADD_USER_VIEW)
.addAttr("ACCOUNT_ROLES", Arrays.asList(AccountRole.values()))
.addAttr("TENANTS",tenantInfoService.getAll())
.addAttr("errors",result)
.addAttr("account",userAccount).toMav();
}
return render(ADD_USER_VIEW)
.addAttr("ACCOUNT_ROLES", Arrays.asList(AccountRole.values()))
.addAttr("TENANTS",tenantInfoService.getAll())
.addAttr("account",new UserAccountForm())
.toMav();
}
Here's the render library That I have created.
public class RenderMavBuilder {
private final ModelAndView mav;
public static RenderMavBuilder render(String viewname){
RenderMavBuilder target = new RenderMavBuilder(viewname);
return target;
}
public RenderMavBuilder addAttr(String attrName, Object value){
mav.addObject(attrName, value);
return this;
}
public RenderMavBuilder addAttr(Object value){
mav.addObject(value);
return this;
}
public RenderMavBuilder addAttrs(Map<String , ?> attrs){
mav.addAllObjects(attrs);
return this;
}
private RenderMavBuilder(String viewName){
this.mav = new ModelAndView(viewName);
}
public ModelAndView toMav(){
return mav;
}
}
Here's my validator
Here's my form.
<div class="col-md-6 centered">
<form:errors path="*" />
<form:form commandName="account" method="post" action="${pageContext.request.contextPath}/user/save">
<!-- Username -->
<div class="col-xs-12 form-group">
<label class="control-label">Username</label>
<form:input path="username" type="text" class="form-control" />
</div>
<!-- Password -->
<div class="col-xs-12 form-group">
<label class="control-label">Password</label>
<form:password path="password" class="form-control"/>
</div>
<!-- Password -->
<div class="col-xs-12 form-group">
<label class="control-label">Password</label>
<form:password path="retypedPassword" class="form-control"/>
</div>
<!-- First Name -->
<div class="col-xs-12 form-group">
<label class="control-label">First Name</label>
<form:input path="firstName" type="text" class="form-control"/>
</div>
<!-- First Name -->
<div class="col-xs-12 form-group">
<label class="control-label">Last Name</label>
<form:input path="lastName" type="text" class="form-control"/>
</div>
<!-- User Role -->
<div class="col-xs-12 form-group">
<label class="control-label">User Role</label>
<form:select path="accountRole" class="form-control">
<form:options items="${ACCOUNT_ROLES}"/>
</form:select>
</div>
<!-- Branch Designation -->
<div class="col-xs-12 form-group">
<label class="control-label">Designated Branch</label>
<select path="tenantId" items="${TENANTS}" class="form-control">
<c:forEach var="branch" items="${TENANTS}">
<option value="${branch.id}">${branch.tenantDescription}</option>
</c:forEach>
</select>
</div>
<!-- Button -->
<div class="col-md-12 form-group">
<button class="form-control btn btn-primary submit-button" type="submit">Save New User <i class="fa fa-check-square-o"></i></button>
</div>
</form:form>
On my controler the binding result has errors. however, the error is not being displayed on the view, what am I missing?
The problem is the way you are constructing your ModelAndView, you should use the Errors object to construct it. Use Errors.getModel() to obtain the underlying Map that represents the model and use that, next to the view name, to construct the ModelAndView.
Next to that for your other model attributes you should simply add #ModelAttribute annotated methods to retrieve those. I would also suggest adding a GET based method which you redirect to after successful submit.
Your helper class seems also rather pointless as doing it simply inside your controller would simplify your code (imho).
Your controller could look something along these lines.
#RequestMapping(value = "/save",method = RequestMethod.POST)
public ModelAndView saveUserAccount(#ModelAttribute("account") UserAccountForm userAccount, BindingResult result){
AddUserValidator userValidator = new AddUserValidator();
userValidator.validate(userAccount,result);
boolean hasErrors = result.hasErrors();
return new ModelAndView(hasErrors ? ADD_USER_VIEW, "redirect:/add", errors.getModel());
}
#RequestMapping(value="/add")
public String addUserAccount(Model model) {
model.addObject("account", new UserAccountForm());
return ADD_USER_VIEW;
}
#ModelAttribute
public void referenceData(Model model) {
model.addObject("ACCOUNT_ROLES", Arrays.asList(AccountRole.values()));
model.addObject("TENANTS",tenantInfoService.getAll());
}
Hibernate Validator doesn't show error message. What did i miss? Please see my code below.
Here is a dependency:
<!-- Hibernate Validator -->
<dependency>
<groupId>org.hibernate</groupId>
<artifactId>hibernate-validator</artifactId>
<version>4.2.0.Final</version>
</dependency>
And Entity with annotated column:
#Entity
#Table(name = "transport")
public class Transport {
....
#NotEmpty
#Column(name = "name")
private String name;
....
}
Here are methods from controller:
//show all and add form
#RequestMapping (value = "/admin/transports", method = RequestMethod.GET)
public String findAll(ModelMap map){
List<Transport> transports = transportService.findAll();
map.put("transport", new Transport());
map.put("transports", transports);
return "admin/transports/list";
}
//add new
#RequestMapping(value = "/admin/transport/add", method = RequestMethod.POST)
public String addTypeShop(#ModelAttribute("type") #Valid Transport transport, BindingResult result) {
if (result.hasErrors()) {
return "redirect:/admin/transports";
} else {
this.transportService.addTransport(transport);
return "redirect:/admin/transports";
}
}
And jsp page:
<form:form role="form" action="/admin/transport/add" method="post" commandName="transport">
<div class="row">
<div class="col-lg-6">
<div class="form-group">
<label for="name">Name</label>
<form:input type="text" path="name" class="form-control input-sm" id="name" autofocus="true"/>
<form:errors path="name"/>
</div>
</div>
<input type="submit" class="btn btn-sm btn-primary" value="Add" onclick="loading()"/>
</form:form>
You do not have any code showing the errors back to the end user.
Please see the following link for an example:
http://www.mkyong.com/spring-mvc/spring-mvc-form-errors-tag-example/
Also, It doesn't look like you actually set your command object in your form. You might not have shown that code though.
Small side note, I would not do a redirect if you have validation errors, just send them directly back to the page they came from.
EDIT
After further review, I do see that you have . Normally this goes outside and above the form itself.
<form:errors path="transport"/>
<form:form role="form" action="/admin/transport/add" method="post" commandName="transport">
<div class="row">
<div class="col-lg-6">
<div class="form-group">
<label for="name">Name</label>
<form:input type="text" path="name" class="form-control input-sm" id="name" autofocus="true"/>
</div>
</div>
<input type="submit" class="btn btn-sm btn-primary" value="Add" onclick="loading()"/>
</div>
</form:form>