Pulling data from json file to use in .$post in Jquery

Question

I'd like to pull data from a json file to post it to the server side.

This kind of data decleration works:

$.post('/createDBJSON',{'name':'bar'},
function(data) {window.alert(data);}

However I need something like this:

$.post('/createDBJSON',{'/assets/appconf/db.json'},
function(data) {window.alert(data);}

I know $.post gets data as PlainObject or String but I want to somehow post data as json file because my json file is very complex (too many embedded key-val pairs) to easily parse to js variable(s) using $.getJSON to use in in $.post as documented.

Is there another approach I should consider in order to accomplish that?

Thank you in advance.

This link may usefull http://stackoverflow.com/questions/2177548/load-json-into-variable — Tamil Selvan C, Mar 23 '13 at 15:17
This is very weird. You want to pull json from the server (`db.json`), and then push it back to the server in a `post` request, without even parsing it into an object locally? It seems like you should add some functionality on the server side, to avoid this useless transfer of data. — tcovo, Mar 23 '13 at 15:33
I think I'm doing something stupid. I should use a JSON parser in server side without involving client side in the first place. I've found some docs regarding GSON to parse JSON data. Do you have a suggestion like this in order to use it in Play Framework 2.1? — Hako, Mar 23 '13 at 15:36

score 2 · Answer 1 · answered Mar 23 '13 at 15:34

2

You could use $.getJSON like this:

$.getJSON('/assets/appconf/db.json', function(json) {

     $.post('/createDBJSON',json,
     function(data) {window.alert(data);}

});

answered Mar 23 '13 at 15:34

Carol Skelly

351,302
90
710
624

It seems working in POST perspective. Do you know how to parse it in play 2.1? JsonNode json = request().body().asJson();String name = json.findPath("style_nodes").getTextValue(); seems to fail on that. – Hako Mar 23 '13 at 22:10

score 1 · Accepted Answer · answered Mar 23 '13 at 22:52

I think you might be hitting a subtle issue with $.post() when the data is an object. It gets converted to a string, but not to a JSON string - rather, it is used as a set of key-value pairs for building a application/x-www-form-urlencoded string.

Another issue with $.post() is that it always sends a content-type header of application/x-www-form-urlencoded; charset=UTF-8. This might be the reason why the server is crashing: it's expecting JSON, but the content-type is application/x-www-form-urlencoded. To fix this we can use the more general $.ajax() which has more options.

Try this:

$.getJSON('/assets/appconf/db_trial.json', function(firstData) 
{
    $.ajax({
        type: "POST",
        url: '/createDBJSON',
        data: JSON.stringify(firstData), // send JSON representation
        contentType: 'application/json; charset=utf-8', // set correct content-type header
        success: function(secondData) {window.alert(secondData);}
    });
});

We could also try another method which never bothers to convert the first json response into an object and then back into a json string, instead just keep it as text the whole time:

$.ajax({
    dataType: "text", // parse response only as text
    url: '/assets/appconf/db_trial.json',
    success: function(jsonString) {
        $.ajax({
            type: "POST",
            url: '/createDBJSON',
            data: jsonString, // jsonString is already a json string
            contentType: 'application/json; charset=utf-8', // set correct content-type header
            success: function(secondData) {window.alert(secondData);}
        });
    }
});

Please try both!

But I still recommend fixing your back-end so the data doesn't pass through the client for no reason! I think Play Framework 2 includes Jackson for JSON manipulation, so you just need to import the right classes, and search the internet to learn how to read JSON files with the Jackson library.

score 1 · Answer 3 · answered Mar 23 '13 at 22:55

Turns out that my content type was not json. It needs to be specified. Play 2.1 json body parse example works as documented. I wish that they provide the proper client call example as well...

Here is the working ajax call:

$.getJSON('/assets/appconf/db_trial.json', function(json) 
{
    $.ajax({
          url:'/createDBJSON',
          type:"POST",
          data:JSON.stringify(json),
          contentType:"application/json; charset=utf-8",
          dataType:"json",
          success: function(){

          }
        });

});

Pulling data from json file to use in .$post in Jquery

3 Answers3