Harry
Harry

Reputation: 4773

Pass array of objects using jquery in spring MVC controller

I am trying to pass array of files object to spring MVC controller. But I am getting 400 Bad request error.

In my jsp I have written a jquery method to get the array of files.

function getFilelist() {
      var files = $('body').data('filelist');
      return files;
}

And uploading these all files using post Json method.

---Updated----

I am adding the whole init() method:

function init() {
    $('input:button').button();
    $('#submit').button();

    $('#uploadForm').submit(function(event) {
        event.preventDefault();   

        alert("uploading..");

        $.postJSON('fileSave.htm', {
            filename: getFilelist()    
        },
                   function(result) {
                       if (result.success == true) {
                           dialog('Success', 'Files have been uploaded!');
                       } else {
                           dialog('Failure', 'Unable to upload files!');
                       }
                   });
    });

    $('#reset').click(function() {
        clearForm();
        dialog('Success', 'Fields have been cleared!');
    });

    $('#upload').fileupload({
        dataType: 'json',
        done: function (e, data) {
            $.each(data.result, function (index, file) {
                $('body').data('filelist').push(file);
                $('#filename').append(formatFileDisplay(file));
                $('#attach').empty().append('Add another file');
            });
        }
    });

    $("#attach").click(function () {
        $("#upload").trigger('click');
    });

    $('body').data('filelist', new Array());
}

Here getFilelist() is the array of file objects. In my controller I have written:

@RequestMapping(value="fileSave", method=RequestMethod.POST)
public @ResponseBody StatusResponse message(
    @RequestParam("filesAttachedList") FilesAttachedList filesAttachedList) {
  // some code here
}

My FilesAttachedList class:

public class FilesAttachedList implements Serializable {
    private static final long serialVersionUID = 5944305104394883501L;
    private List<FileAttachment> filesList;

    public List<FileAttachment> getFilesList() {
        return filesList;
    }

    public void setFilesList(List<FileAttachment> filesList) {
        this.filesList = filesList;
    }

    @Override
    public String toString() {
        return "FilesAttachedList [filesList=" + filesList + "]";
    }
}

So how can I pass the array of objects from jquery to controller?

--updated--

When I check the browser getFileList returns

 Object
 attachableId: null
 attachableType: null
 attachmentContentType: null
 attachmentFileName: "http://localhost:8080/myproject/resources/images.jpg"
 attachmentFileSize: 6994
 attachmentUpdatedAt: null
 createdAt: null
 creatorId: null
 id: null
 name: "images.jpg"
 updatedAt: null
 updaterId: null
 __proto__: Object
 length: 1
 __proto__: Array[0]

This is what if I add two image objects

 Array[2]
 0: Object
 1: Object
 length: 2
 __proto__: Array[0]

----Update 3 ---

when I change from @RequestParam("filesAttachedList") FilesAttachedList filesAttachedList to @RequestBody final String filesAttachedList and add two images it gives me the following string objects. Can I read this string?

{
  "filename": [
    {
      "id": null,
      "createdAt": null,
      "updatedAt": null,
      "name": "images.jpg",
      "attachableId": null,
      "attachableType": null,
      "attachmentFileName": "http:\/\/localhost:8080\/myproject\/resources\/images.jpg",
      "attachmentContentType": null,
      "attachmentFileSize": 6994,
      "attachmentUpdatedAt": null,
      "creatorId": null,
      "updaterId": null
    },
    {
      "id": null,
      "createdAt": null,
      "updatedAt": null,
      "name": "lion.jpg",
      "attachableId": null,
      "attachableType": null,
      "attachmentFileName": "http:\/\/localhost:8080\/myproject\/resources\/lion.jpg",
      "attachmentContentType": null,
      "attachmentFileSize": 36670,
      "attachmentUpdatedAt": null,
      "creatorId": null,
      "updaterId": null
    }
  ]
}

Upvotes: 0

Views: 5475

Answers (1)

Grzegorz Rożniecki
Grzegorz Rożniecki

Reputation: 27995

You didn't print {, }, [ and ] characters which are important here, but I assume it's just one Object while your controller expects a list of FileAttachment objects.

Either add surround files in JS with array return [ files ]; or, if it'll always be only on FileAttachment change controller to @RequestParam("fileAttachment") FileAttachment fileAttachment.

EDIT:

Can you change @RequestParam("fileAttachment") to @RequestParam("filename")? I see you edited your question meanwhile.

Upvotes: 1

Related Questions