AJAX

Your have a form, and there is a Save in it. You can add click callback to this button to submit the form by ajax. Here we only covered what I would like to talk about. For more details, go to http://api.jquery.com/jquery.ajax/.

$("#btn-save").click(function(){
	var form = $(this).closest('form').get(0);
	var jform = $(form);
	$.ajax({
		method:"post",
		dataType: "json",
		url: jform.attr('action'),
		data: jform.serialize(),
		success: function(data, textStatus, jqXHR) {
			//DO YOU SUCCEE STUFF
		},
		error: function(jqXHR, textStatus, errorThrown){
			//DO YOU FAIL STUFF
		},
		complete: function(jqXHR, textStatus){
			//DO YOU FINAL STUFF NO MATTER SUCCESS OR ERROR
		}
	});
});

Assume the client pass an 'id' field to the server. DomainObject can be any of your domain object that mapped to your data source, myService supposed to be any grails server that handle your business logic; MyException could be any of your own exception thrown by your business logic, and DateTimeTools is my own creation to handle date time related function call.

def myFunction(DomainObject domainObject) {
	try {
		myService.dosomething(domainObject)
		response.status = 200
		render([response: 'OK'] as JSON)
	}catch (MyException e) {
		response.status = 500
		render([error: "Unable to XXXX XXXX XXXX. ${e.getMessage()}"] as JSON)
	}catch (Exception e) {
		log.error("Time: ${DateTimeTools.getSystemCurrentTime()} myFunction: ${e.getMessage()}", e)
		response.status = 500
		render([error: "Fail to XXXX XXXX XXXX. Please contact system admin for support."] as JSON)
	}
}

A superset of XMLHTTPRequest. Here mainly, we talk about how to extract the response from the JSON server. In success, error, or complete callback function, you can extract the json response by jqXHR.responseJSON.

Let says we want to extract the error message from the server for the above code, we can do the following in the error callback.

var responseJson = jqXHR.responseJSON;
alert(responseJson.error);