spring mvc ajax form post handling, possible methods and their pros and cons [closed]

Question

I'm currently learning using Spring MVC. During development, I used four different kind of form handling with Ajax & jQuery. Now, I'm wondering what are advantages and disadventages of each methods. Are there any others?

Let's say we have a really simple form with just 2 inputs

<input id="name" type="text" value"Name">
<input id="active" type="checkbox">
<input type="button" onclick="submitForm()">

Let's assume that we are not validating data either on client and server site. We will also omitt handling data returned. I'm just interested in sending data to server. Now how can we handle submit? My solutions were:

1. Request based on PathVariable

JS sending request would look sth like this:

function submitForm() {
    var name = jQuery("#name").val();
    var active = jQuery("#active").is("checked");

    jQuery.ajax("/Submit/Name/" + name + "/Active/"+ active + "/",
    {
        type:"POST"
    });   
}

And also Controller:

 @RequestMapping(value="/Submit/Name/{name}/Active/{active}/",method=RequestMethod.POST)
 publis void submitForm(@PathVariable String name, @PathVariable Boolean active)
 { //something not important here }

Pros in my opinion

• quick way to recieve data in Controller, simple annotation make it works
• type maching for basic types of data (String, Boolean, Numeric)

Cons

• request address grows with data needed
• problem with special characters in url? Not sure about this one, but I remember my teammate had problem with / used as char in data sended to server

2. Request with data

I haven't got clue how name it, but this is the idea in JS file:

function submitForm() {
    var name = jQuery("#name").val();
    var active = jQuery("#active").is("checked");

    var object = {name:name,active:active};

    jQuery.ajax("/Submit/",
    {
        type:"POST",
        data: object
    });   
}

And Controller:

 @RequestMapping(value="/Submit/",method=RequestMethod.POST)
 publis void submitForm(@RequestParam(value="name") String name, @RequestParam(value="active") Boolean active)
 { //something not important here }

In my opinion, not much different from first method, but:

Pros

• shorter request address

Cons

• method declaration with many parameters may be huge

3.Sending JSON to server as PathVariable

In JS file:

function submitForm() {
    var name = jQuery("#name").val();
    var active = jQuery("#active").is("checked");

    var object = {name:name,active:active};

    jQuery.ajax("/Submit/" + JSON.stringify(object),
    {
        type:"POST"
    });   
}

And Controller

 @RequestMapping(value="/Submit/{json}",method=RequestMethod.POST)
 publis void submitForm(@RequestParam(value="name") String name, @RequestParam(value="active") Boolean active)
 { 
    //now we are actually doing sth important here, cause we need to parse JSON
 }

Pros

• short request address
• short method declaration

Cons

• JSON parsing on my own

4.JSON as RequestBody with class mapped

My favourite method, but not always possible as we need to write multiple class just for wrapping sent data, JS:

function submitForm() {
    var name = jQuery("#name").val();
    var active = jQuery("#active").is("checked");

    var object = {name:name,active:active};

    jQuery.ajax("/Submit/",
    {
        type:"POST",
        data:JSON.stringify(object)
    });

And Java code:

public class Wrapper {
    private String name;
    private Boolean active;    
    //getters and setters
}

 @RequestMapping(value="/Submit/",method=RequestMethod.POST)
 publis void submitForm(@RequestBody Wrapper wrapper)
 { 
    //all data available with Wrapper class
 }

Pros

• mapping into desired object
• quick and simple

Cons

• we need to write wrappers for every data sent to server

That would be all I know currently. I would appreciate and critism, suggestions for better solutions or anything. Thanks!

Answer 1

(1) Request based on PathVariable

As you said you will get problems with special characters (such as /). Path-based URLs are most readable if left short. E.g., /hotel/{h}/room/{r}. Sometimes, a combination of path and request parameters are used to denote mandatory vs optional parameters.

(2) Request with data

This would be a great approach giving you flexibility to easily add/remove Request Parameters as well as managing different combinations of parameters.

(3) Sending JSON to server as PathVariable

I see the same technical problems with this approach as (1). Without proper escaping (and Spring at the current time of writing can't handle / in any form) this option is not viable. (4) is the way to do this.

(4) JSON as RequestBody with class mapped

This would be preferable for complex objects. Typically spring can help you map json to Java objects directly. The tradeoff is that it cannot be tested as easily from a browser. I believe this is a common pattern in RESTful services, although it doesn't necessarily dictate a transmission technology.

---

In summary,

• using query parameters is simple, and enables users to test the service directly from the browsers address bar.

• using objects in the request body is useful to get flexibility in handling complex data but cannot as easily be tested from the browser.

The path-variable options don't fair well with spring unless well-formed data withouth special characters such as / are submitted.