I have a JSP form that is retrieved using a RequestMapping during GET. JSP page structure for the page looks like this:
<div id="myDiv">
<script>
function update() {
update_fn(formId, ... more parameters); // this is a function defined in a .js file, this submits the form
}
</script>
<form:form ... >
<button id="myButtonUniqueIDWithCurrentTime" onclick="update()">OK</button>
</form:form>
</div>
Now when the button is clicked, udpate_fn() is called which sends a POST request using $.ajax. The RequestMapping contains the form annotated with @ModelAttribute
and @Valid
.
If BindResult is error free then I push the data to the database otherwise I send back the same form to the client. This is what it looks like.
@RequestMapping(value = "/formSubmit", method = RequestMethod.POST)
public ModelAndView addData(
@ModelAttribute("editForm") @Valid BackingForm form,
BindingResult result, Model model) {
boolean success = false;
String message = "";
Map<String, Object> m = new HashMap<String, Object>();
if (form == null) {
form = new BackingForm();
} else {
if (result.hasErrors()) {
success = false;
message = "Please fix the errrors noted above";
} else {
try {
MyEntity entity = form.getWrappedEntity();
entityRepository.addData(entity);
form = new BackingForm(); // why is empty form not visible in JSP
success = true;
message = "Data Successfully Added";
} catch (EntityExistsException ex) {
ex.printStackTrace();
success = false;
message = "Entity Already exists.";
} catch (Exception ex) {
ex.printStackTrace();
success = false;
message = "Internal Error. Please try again or report a Problem.";
}
}
}
m.put("editForm", form);
m.put("success", success);
m.put("message", message);
ModelAndView mv = new ModelAndView("editForm");
mv.addObject("model", m);
return mv;
}
This is the Javascript for the post request.
function updateGeneric(form, resultDivId, url) {
var data = $("#" + form.getAttribute("id")).serialize();
$.ajax({
type : "POST",
url : url,
data : data,
success : function(response) {
console.log(response);
$("#" + resultDivId).replaceWith(response);
}
});
}
As shown in the code above When the data is successfully added I do the following:
form = new BackingForm(); // why is empty form not visible in JSP
success = true;
message = "Data Successfully Added";
Now when I putting this form in the ModelAndView and then replacing the rendered view with the ModelAndView returned'editForm.jsp', why is the correct form not showing up in the page? I am getting the correct values for message, success in the jsp page. But the form contains the values from the old submission even when it is set to a new form.
Note I am not redirecting after the POST. I am just replacing an HTML fragment using jquery.
Can you point out what is wrong with my code and what could be a neat way to do the same thing?
Thanks in Advance!