Main Page
Our main page contains four buttons linked to Javascript functions performing Ajax calls:... <body> <h1>Welcome To REST With Ajax !!!</h1> <button type="button" onclick="RestGet()">GET</button> <button type="button" onclick="RestPut()">PUT</button> <button type="button" onclick="RestPost()">POST</button> <button type="button" onclick="RestDelete()">DELETE</button> </body> ...
Javascript
Our Javascript file contains the four functions:var prefix = "/spring-rest-with-ajax";
var RestGet = function() {
$.ajax({
type: 'GET',
url: prefix + "/MyData/" + Date.now(),
dataType: 'json',
async: true,
success: function(result) {
alert("At " + result.time
+ ": " + result.message);
},
error: function(jqXHR, textStatus, errorThrown) {
alert(jqXHR.status + " " + jqXHR.responseText);
}
});
}
var RestPut = function() {
var JSONObject= {
"time": Date.now(),
"message": "User PUT call !!!"
};
$.ajax({
type: 'PUT',
url: prefix + "/MyData",
contentType: "application/json; charset=utf-8",
data: JSON.stringify(JSONObject),
dataType: 'json',
async: true,
success: function(result) {
alert("At " + result.time
+ ": " + result.message);
},
error: function(jqXHR, textStatus, errorThrown) {
alert(jqXHR.status + " " + jqXHR.responseText);
}
});
}
var RestPost = function() {
$.ajax({
type: 'POST',
url: prefix + "/MyData",
dataType: 'json',
async: true,
success: function(result) {
alert("At " + result.time
+ ": " + result.message);
},
error: function(jqXHR, textStatus, errorThrown) {
alert(jqXHR.status + " " + jqXHR.responseText);
}
});
}
var RestDelete = function() {
$.ajax({
type: 'DELETE',
url: prefix + "/MyData/" + Date.now(),
dataType: 'json',
async: true,
success: function(result) {
alert("At " + result.time
+ ": " + result.message);
},
error: function(jqXHR, textStatus, errorThrown) {
alert(jqXHR.status + " " + jqXHR.responseText);
}
});
}
Controller
Our controller captures the REST calls and returns a JSON. In a real applications, one would perform CRUD operations rather than returning JSONs:@Controller
@RequestMapping(value = "/MyData")
public class MyRESTController {
@RequestMapping(value="/{time}", method = RequestMethod.GET)
public @ResponseBody MyData getMyData(
@PathVariable long time) {
return new MyData(time, "REST GET Call !!!");
}
@RequestMapping(method = RequestMethod.PUT)
public @ResponseBody MyData putMyData(
@RequestBody MyData md) {
return md;
}
@RequestMapping(method = RequestMethod.POST)
public @ResponseBody MyData postMyData() {
return new MyData(System.currentTimeMillis(),
"REST POST Call !!!");
}
@RequestMapping(value="/{time}", method = RequestMethod.DELETE)
public @ResponseBody MyData deleteMyData(
@PathVariable long time) {
return new MyData(time, "REST DELETE Call !!!");
}
}
Running The Example
Once compiled, the example can be run with mvn tomcat:run. Then, browse:http://localhost:8585/spring-rest-with-ajax/
The main page will be displayed:
If you click on any button, a pop-up will be displayed:
See here for more about REST • More Spring related posts here.


No comments:
Post a Comment