issue while json parsing in jquery

Question

I have an array like this comming from php file with json_encode.

[{"label":"Mississippi State, Mississippi","value":"mississ"},
 {"label":"Mississauga, Ontario","value":"mississ"},
 {"label":"Mississippi Station, Ontario","value":"mississ"}]

This array is dynamic. I want to alert the label of this array.

JQUERY:

var obj = $.parseJSON(data);
alert(obj.label);

It's giving me error like obj is null.

EDIT:

basically I want to put these values in dropdown search box: like this jquery plugin

AJAX:

$.ajax({
            url: "ajax/ir_populate_search.php",
            dataType: "json",
            type: "POST",
            data: {
                keyword: request.term,
                path: path
            },

 success: function(data){
    var obj = $.parseJSON(data);
    var availableCities = obj.label;
    $( "#txtLocation" ).autocomplete({
                    source: availableCities
                });
}

can you give your ajax call code cause if you don't use dataType:json then your data don't have the response string. its in data.responseText. Try $.parseJSON(data.responseText); — Fisherman
– Fisherman, Commented Mar 26, 2014 at 17:06
Why are you doing parseJson of a json object ? i mean data is already the json. — Eduardo Quintana
– Eduardo Quintana, Commented Mar 26, 2014 at 17:10
dataType: "json" tells jQuery to parse it for you. data is already parsed. data is an array of objects. — gen_Eric
– gen_Eric, Commented Mar 26, 2014 at 17:11
you do not need to parse json its already in parsed format .. call directly like data.label — Fisherman
– Fisherman, Commented Mar 26, 2014 at 17:16

Hüseyin BABAL · Accepted Answer · 2014-03-26 17:14:11Z

1

You do not need to parse json, it is already json. Use this;

$( "#txtLocation" ).autocomplete({
    source: function( request, response ) {
        $.ajax({
            url: "ajax/ir_populate_search.php",
            data: {
                    keyword: request.term,
                    path: path
            },
            dataType: "json",
            success: function( data ) {
                response( $.map( data, function( item ) {
                    return {
                        label: item.label,
                        value: item.value
                    }
                }));
            }
        });
    }
});

answered Mar 26, 2014 at 17:14

Hüseyin BABAL

15.6k5 gold badges53 silver badges74 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

RNK Over a year ago

It works for me.. Just one problem here. I can not select the search results. It should populate in text box after selecting.

talemyn · Accepted Answer · 2014-03-26 17:16:46Z

1

From the looks of it, you already have a structure that you can work with, but it is not an Object . . . it's an array of Objects, so, to access the label parameter, you need to identify which object you want to look at, by providing its index, like this:

data[n].label

Using your example, you would get these values, for the various indexes:

data[0].label ==> Mississippi State, Mississippi
data[1].label ==> Mississauga, Ontario
data[2].label ==> Mississippi Station, Ontario

So, to loop through them all and get the data for each entry, you could do something like this:

for (i = 0; i < data.length; i++) {
    . . . do something with: data[i].label . . .
    . . . do something with: data[i].value . . .
}

edited Mar 26, 2014 at 17:16

answered Mar 26, 2014 at 17:11

talemyn

8,0004 gold badges33 silver badges52 bronze badges

Comments

Adam Libuša · Accepted Answer · 2014-03-26 17:12:04Z

0

If you do this dataType: "json", jQuery does JSON parsing for you, so data is already a JavaScript object. Remove var obj = $.parseJSON(data); and work with data directly.

answered Mar 26, 2014 at 17:12

Adam Libuša

7431 gold badge7 silver badges29 bronze badges

Comments

Eduardo Quintana · Accepted Answer · 2014-03-26 17:14:35Z

Data is already the json object $.parseJSON is used to parse the JSON string to an object Like this:

$.parseJSON('[{"label":"Mississippi State, Mississippi","value":"mississ"},{"label":"Mississauga, Ontario","value":"mississ"},{"label":"Mississippi Station, Ontario","value":"mississ"}]')

Just using data and adding to the array the values you're using will work

$.ajax({
            url: "ajax/ir_populate_search.php",
            dataType: "json",
            type: "POST",
            data: {
                keyword: request.term,
                path: path
            },success: function(data){
           //data is already the array of objects
           //just loop them 

            var availableCities = [];
            for(i in data){
              availableCities.push(data[i].label)
            }


           $( "#txtLocation" ).autocomplete({
                    source: availableCities
                });
}
})

Davide Pastore · Accepted Answer · 2015-10-03 10:45:13Z

0

You don't need jquery for using a json object in javascript

Try something like that:

$data = [{"label":"Mississippi State, Mississippi","value":"mississ"},
         {"label":"Mississauga, Ontario","value":"mississ"},
         {"label":"Mississippi Station, Ontario","value":"mississ"}]

$data[0].label

edited Oct 3, 2015 at 10:45

Davide Pastore

8,73810 gold badges42 silver badges57 bronze badges

answered Mar 26, 2014 at 17:10

Matteo

1,66417 silver badges24 bronze badges

Collectives™ on Stack Overflow

issue while json parsing in jquery

5 Answers 5

1 Comment

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

1 Comment

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related