Pass multiple JSON objects from client to server using jQuery and JAVA

Question

I would like to ask about how to pass the multiple JSON object from Client to Server side. At first, I got the JSON object from 3rd Party API. After that, I want to pass them to Java method on the Server side. This is what I have tried but it is not success

on Client side (JSP)

function getInfo(InkBlob){

        var myInkBlob = JSON.stringify(InkBlob);

        jQuery.ajax({
            type: 'POST',
            url: '/webapp/filepicker/importAssets',
            dataType: 'json',
            data: {"inkBlob": myInkBlob}
        });}

jQuery POST the data as

enter image description here

If I don't use JSON.stringify, the result will be like,

Just for illustrate if I don't use JSON.stringify

This is the method that Response for the incoming data

@RequestMapping(value = "/importAssets", method = RequestMethod.POST)
@ResponseBody
public void importAssets2(String[] inkBlob) throws Exception {

    System.out.println(inkBlob); // print as [Ljava.lang.String;@56bdbbec (and another 2 similar)
    System.out.println(inkBlob.length); // print as 15}

I want to use the data inside the object. For example, if I want to get the URL of the first object. I want to just inkBlob[0].URL. And the expected length of the inkBlob in this example should be 3 because only 3 object pass to the method. How can I achieve that???

score 0 · Answer 1 · answered Sep 10 '13 at 12:57

0

Spring provides way to pass on a complete bean submitted from the form

Try using this : Here InkBlob is a bean containing variable names and types exactly same as getting passed in post request.

@RequestMapping(value = "/importAssets", method = RequestMethod.POST) @ResponseBody

public void importAssets2(@ModelAttribute(inkBlob) InkBlob inkBlob) throws Exception {

............Other code }

answered Sep 10 '13 at 12:57

Vineet Kasat

994
7
14

It is not work. @Vineet I have created bean for inkBlob and do as you suggest but inkBlob still null when jQuery sent the JSON to the method. Anyway, my code do not submit JSON object from the form but the method "importAssest2" will be call by onSuccess of $.Ajax (by Jquery). I do not know much about Spring but the Annotation "ModelAttribute" is seem to be the answer but I don't know why it is not work for my case. Maybe I have to Change anytihng in jQuery code? – Takumi Sep 11 '13 at 08:53
@Takumi indeed Model attribute is the correct solution. It just expects the bean with the same name ( inkBlob) being passed in the ajax call I have used it many a times. It works fine. For Usage you can refer to following link. : http://stackoverflow.com/questions/3423262/what-is-modelattribute-in-spring-mvc. Hoe it helps... – Vineet Kasat Sep 11 '13 at 19:15
Thank you for your help @Vineet It seems like the Problem is the code on the Client side now. Also, the example or the link doesn't show the Client side code and how the file was sent to the Controller. I do not know much about Spring. Could you please look at the jQuery POST data without stringify applied. I think the data that I sent from jQuery to Controller is not compatible. Do you have any idea on how to make work together?? – Takumi Sep 12 '13 at 13:27
@Takumi Adding Sample code as another Answer, as It was not allowing a long comment. – Vineet Kasat Sep 13 '13 at 10:56

score 0 · Answer 2 · answered Sep 13 '13 at 10:57

Sample code for client

<form:hidden path="fileName" value="xxxx"/>
<input type = "hidden" name = "isWritable" value = "yyyyy"/>
<input type = "hidden" name="mimeType" value="zzzzz"/>
............

</form:form>

And on Server Side Handle it like this  :

@RequestMapping(value = "/importAssets", method = RequestMethod.POST) @ResponseBody

public void importAssets2(@ModelAttribute("inkBlob") InkBlob inkBlob) throws Exception {

............Other code }

Where InkBlob should be like this :

public class InkBlob implements Serializable { private static final long serialVersionUID = 15463435L;

String fileName;
String isWritable;
String mimeType;
......


public void setFileName(String fileName){
this.fileName = fileName;
}

.... Other Getters and settters.

}

Thank you so much for your answer and your effort. As I said, it is not a form. The JSON I got come from 3rd Party API and I just want to pass it to the Controller. So, I don't think this is the solution for Client side in my case. No form and JSON is created by 3rd Party API. My duty is to pass these JSON, as Show in the Image on my question, to the Controller. — Takumi, Sep 13 '13 at 18:47

Pass multiple JSON objects from client to server using jQuery and JAVA

2 Answers2