Skip to content

Instantly share code, notes, and snippets.

@cjmamo

cjmamo/ApplicationController.java

Last active December 14, 2015 09:39
Show Gist options
  • Save cjmamo/5066797 to your computer and use it in GitHub Desktop.
Save cjmamo/5066797 to your computer and use it in GitHub Desktop.
Download ZIP
Posting & Processing JSON with jQuery & Spring MVC
Raw
ApplicationController.java
...
@Controller
public class ApplicationController {
@RequestMapping(value = "/create-client", method = RequestMethod.GET)
public String getCreateClientForm() {
return "NewClientForm";
}
@RequestMapping(headers = "Content-Type=application/json", value = "submit-create-client", method = RequestMethod.POST)
@ResponseStatus(value = HttpStatus.OK)
public void processSubmitCreateClient(@RequestBody List<Map<String, String>> client) throws Exception {
Map<String, String> formInputs = new HashMap<String, String>();
for (Map<String, String> formInput : client) {
formInputs.put(formInput.get("name"), formInput.get("value"));
}
System.out.println(formInputs);
}
}
Raw
NewClientForm.jsp
<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
</head>
<body style="text-align:center">
<div align="center">
<h2>New Client Form</h2>
<form method="POST" action="submit-create-client.html">
<table>
<tr>
<td>Client name :</td>
<td><input name="name"/></td>
</tr>
<tr>
<td>Client surname :</td>
<td><input name="surname"/></td>
</tr>
<tr>
<td>Address Line 1 :</td>
<td><input name="addressLine1"/></td>
</tr>
<tr>
<td>Address Line 2 :</td>
<td><input name="addressLine2"/></td>
</tr>
<tr>
<td>City :</td>
<td><input name="city"/></td>
</tr>
<tr>
<td>Country :</td>
<td><input name="country"/></td>
</tr>
<tr>
<td>Current Account Opening Balance :</td>
<td><input value="0" name="currentAccountOpeningBalance"/></td>
</tr>
<tr>
<td>Saving Account Opening Balance :</td>
<td><input value="0" name="savingAccountOpeningBalance"/></td>
</tr>
<tr>
<td><input type="submit"/></td>
</tr>
</table>
</form>
<script type="text/javascript">
$('form').submit(function () {
$.ajax({
url: $(this).attr('action'),
type: 'POST',
data: JSON.stringify($(this).serializeArray()),
contentType: 'application/json',
success: function (data) {
alert('Client created!! :-)')
},
error: function (jqXHR, textStatus, errorThrown) {
alert('An error has occured!! :-(')
}
})
return false
})
</script>
</div>
</body>
</html>
Raw
output.json
[{"name":"name","value":"John"},{"name":"surname","value":"Doe"},{"name":"addressLine1","value":"My Address 1"},{"name":"addressLine2","value":"My Address 2"},{"name":"city","value":"Valletta"},{"name":"country","value":"Malta"},{"name":"currentAccountOpeningBalance","value":"50000"},{"name":"savingAccountOpeningBalance","value":"60000"}]
Raw
pom.xml
<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
<modelVersion>4.0.0</modelVersion>
...
<dependencies>
<dependency>
<groupId>org.codehaus.jackson</groupId>
<artifactId>jackson-mapper-asl</artifactId>
<version>1.9.2</version>
</dependency>
...
</dependencies>
</project>
Raw
run.sh
mvn tomcat:run
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment