4

Solved. The solution is to set contentType to 'application/json' and use the JSON.stringify(obj) instead of obj, but you may then have to change how you get the data on your server, depending on the language or framework. Original question below...

Here's what I'm trying

var obj = {
    'firstName': 'bill',
    'lastName': 'johnson',
    'hobbies': ['apples', 'dogs']
    });
$.ajax({
    type: 'POST',
    url: '/myurl'
    data: obj,
    success: function(data){alert(data);}
    });

If I alert/log a JSON.stringify(obj), I get the correct result, i.e.:

{'firstName': 'bill', 'lastName': 'johnson', 'hobbies': ['apples', 'dogs']}

However, when I do the above ajax call, my server gets the following:

{'firstName': 'bill', 'lastName': 'johnson', 'hobbies[]': 'apples'}

Which clearly is not proper json. I've tried adding various contentType arguments but then my server actually gets nothing (an empty post request).

I also tried setting the data argument to a pre-stringified string of JSON (which is correct), but then jquery escapes it and my server gets this:

{"{\"firstName\":\"bill\",\"lastName\":\"johnson\",\"hobbies\":[\"apples\",\"dogs\"]}": ""}

I tried setting processData to false and that changes nothing.

I've researched this for hours and haven't gotten it to work. Surely there's a way to send json with lists to the server...

any tips?

user3391564
  • 576
  • 1
  • 5
  • 16
  • Send the obj as JSON.stringify(obj). If required, deserialize the same at server side or some html decode stuff. – d-coder Apr 30 '14 at 05:13
  • How does the server want to get it? You could send the data as JSON rather than x-www-form-urlencoded ... http://benjamin-schweizer.de/jquerypostjson.html -- And here's a little more background reading: http://stackoverflow.com/questions/2845459/jquery-how-to-make-post-use-contenttype-application-json – mgilson Apr 30 '14 at 05:16
  • @mgilson the server wants to get it as raw, unescaped json, like {"firstname": "bill"... etc., though that could change if necessary. I'll try the code in the blog post. – user3391564 Apr 30 '14 at 05:21
  • check the answer here : http://stackoverflow.com/questions/16574482/decoding-json-string-in-java – dev1234 Apr 30 '14 at 05:24
  • @mgilson unfortunately the code in the blogpost doesn't work for me. If I set the contentType argument, my server gets an empty request. – user3391564 Apr 30 '14 at 05:34
  • 1
    @user3391564 -- I doubt it gets an empty request. The problem is that most frameworks are expecting x-www-form-urlencoded data. If you actually look at the request _body_, the JSON will be in there (which you may need to parse yourself). I recently ran into this problem when dealing with requests from angular's $http (since it posts the json as `application/json` which actually makes some sense...) – mgilson Apr 30 '14 at 05:37
  • @mgilson Yes, you're right. Upon further investigation it's not empty. It seems to be getting the correct json and I just need to figure out how to get it from the response object. – user3391564 Apr 30 '14 at 05:45

2 Answers2

1

From your post that looks correct to me, I am somewhat new to JSON myself but it looks like its treating the last key-value pair as an array, to access the individual elements you would have to use the correct index to access the value. from json.org JSON is built on two structures: •A collection of name/value pairs. In various languages, this is realized as an object, record, struct, dictionary, hash table, keyed list, or associative array. •An ordered list of values. In most languages, this is realized as an array, vector, list, or sequence. you could check it on jsonlint.com if you still think something is wrong.

webdev8183
  • 153
  • 2
  • 4
  • 16
0

Try this

  $.ajax({
    url: url,
    type: 'POST',
    datatype: "json",
    traditional: true,
    data: { 
        menuItems: JSON.stringify(myArray),
                },
    success: function () { window.alert('success'); },
    error: function (event, request, settings) {  
        window.alert('error'); },
    timeout: 20000
 });
monu
  • 370
  • 1
  • 10
  • Its is not a php code ... You should use JSON.stringify(array) and then send to ajax data and use dataType as "json" – monu Apr 30 '14 at 05:17
  • I've tried only stringifying the arrays, but then I get {"hobbies": "["apples", "dogs"]"}. Also, isn't dataType actually for the expected data type of the response, not the request? – user3391564 Apr 30 '14 at 05:32
  • @user3391564 I think this is what you want. What do you mean bydataType actually for the expected data type of the response, not the request? – monu Apr 30 '14 at 05:35
  • I think setting the dataType has no effect on the request, but rather on the interpretation of the data and hence the object that is passed to the success function. With the code you suggested I still get all the \'s. traditional: true doesn't seem to change that. – user3391564 Apr 30 '14 at 05:40