Parse JSON data from url

Question

I have JSON data in following format:

parent: {
       child: {
             sample:[
                     {
                      key:value,
                      key:value,
                     }
                     {
                      key:value,
                      key:value,
                     }
                     {
                      key:value,
                      key:value,
                     }
                    ] 
                 }
            }

How should i parse this data using jquery? using $ ajax or getJSON? Which is preferable method? Please Help

score 1 · Accepted Answer · edited May 23 '17 at 10:32

1

If you need only json data the you can use getJSON.However both are equivalent as getJSON is short hand for $.ajax.More you can read this : Difference Between $.getJSON() and $.ajax() in jQuery In my script:

$.getJSON('test.php',{ val:"test" }, function (data) {
     $.each(data, function (i, v) {
               //do your work here with each value returned from server side.
     });
});

In my test.php file:

if($_SERVER["REQUEST_METHOD"]=="GET"&&$_REQUEST['val']=="test")
{
    header("Content-type: application/json");
    $a1 = array(  'answer1' => 'a', 'score1'=>3, 'answer2' => 'b', 'score2'=>5);
    echo json_encode($a1);
    die();
}

You will receive an object containing :{"answer":"a","score":3,"answer1":"b","score1":5}

if you are working with aspx page then you must use $.ajax as there is an option for content header which must be "application/json" OTHERWISE asp.net will reject the request

Example:

        $.ajax({
            url: "Demo.aspx/Demo_Method",
            contentType: "application/json; charset=UTF-8",
            dataType: "JSON",
            type: "GET",
            success: function (response) {
                alert('Success' + response);
            }
        });

in my aspx page:

    [WebMethod()]
    [System.Web.Script.Services.ScriptMethod(UseHttpGet = true)] 
    public static string Demo_Method()
    {
        return "test";
    }

As you mentioned in your Question.Your data seems to be incorrect.Correct Json Format should be like this:

 parent: { 
     child: { 
          sample: [
                   { key: "1", value: "value1" }, 
                   { key: "2", value: "value2" }, 
                   { key: "3", value: "value3" }
                  ]
            }
         }

If you received a response as in above format then you can simply access this like:

 var response= { parent: { child: { sample: [{ key: "1", value: "value1" }, { key: "2", value: "value2" }, { key: 3, value: "value3"}]}} };

 var samples_arr=response.parent.child.sample;  //create a sample Array.


 $.each(samples_arr,function(){
      alert(v.key+" and "+ v.value); // access here your each element
 });

edited May 23 '17 at 10:32

Community

1
1

answered Apr 03 '13 at 07:53

Gurmeet

3,094
4
19
43

Thanks for your reply.Can you please give some sample for getJSON? – JoVinz Apr 03 '13 at 08:57
Ok I am editing my answer and putting an example here using php.Please check – Gurmeet Apr 03 '13 at 09:20
I dont know php. I want to do the task using jqury. – JoVinz Apr 03 '13 at 09:25
I dont know php. I want to do the task using jqury. I have aspx page which contains the JSON data. – JoVinz Apr 03 '13 at 09:30
but you need some server side code where $.getJSON will send request.Jquery is client side. getJSON as name suggests Getting JSON data from the Server. – Gurmeet Apr 03 '13 at 09:30
I have a certain URL of aspx page. That page contains JSON data. I have to parse it. – JoVinz Apr 03 '13 at 09:36
ok it means your server page is .aspx.Ok wait i'll come with another example of aspx. – Gurmeet Apr 03 '13 at 09:44
plz check response in firebug it will be {'d':'test'} so try alert(response.d); – Gurmeet Apr 03 '13 at 10:18
Sorry but i didnt get you.Can you please explain? – JoVinz Apr 03 '13 at 10:23
i mean to say try this: success: function (response) { alert(response.d); } in the success of ajax call.Also plz confirm your aspx method contains all code as shown.[webMethod] and [System.Web.Script.Services.ScriptMethod(UseHttpGet = true)] – Gurmeet Apr 03 '13 at 10:33
d is the key returned in object.that is why i am referring here response.d – Gurmeet Apr 03 '13 at 10:47
I am getting response as i have mentioned in my original question..what should i do in that case? – JoVinz Apr 03 '13 at 11:00
If you are receiving data like {'key':'value'} then simpley you can use it like response.key.If there is some other format then you can use JSON.parse(response) to make a simple object.More you can refer http://www.json.org/js.html and http://msdn.microsoft.com/en-us/library/ie/cc836466%28v=vs.94%29.aspx – Gurmeet Apr 03 '13 at 11:18
Yes i am getting data in {'key':'value'}. But in format i mentioned above. – JoVinz Apr 03 '13 at 11:50
I am updating my answer please check. – Gurmeet Apr 04 '13 at 04:37
Thanks for valuable help. I will try it. – JoVinz Apr 04 '13 at 05:11
I am getting error in chrome: XMLHttpRequest cannot load URL. Origin null is not allowed by Access-Control-Allow-Origin. In firefox i am getting blank response. – JoVinz Apr 04 '13 at 07:58

Parse JSON data from url

1 Answers1