Accessing individual values from json array in jquery ajax

Question

I have an array returned by AJAX in jQuery. I wanted to iterate through the AJAX success result and take individual values from the JSON array. The data is returned in the form of a string. I'm using jQuery's $.ajax to get it from the server, which works fine.

//my View
$.ajax({
    type: "POST",
    url:"http://localhost:8888/CodeIgniter/index.php/user/usercontroller/search",//controller function
    cache: false,
    data:{"responsible1":res1},
    success: function(data21) { 
        alert(data21);
    });
});

//data 21 alerts the following
{"taskname":"Coding","projname":"Easy Wedding"} 
{"taskname":"Maintain","projname":"Easy Wedding"}
{"taskname":"Flow Chart","projname":"Fnn"}
{"taskname":"development in ","projname":"Fnn"}
{"taskname":"flow chart","projname":"Art gallery"}

How can I access only individual taskname and projectname or how can I convert data21 to an array

That's not a valid JSON object array. Are you sure that's the data that's being returned? It should look like [{...}, {...}, {...}]. — Edgar
– Edgar, Commented Nov 23, 2011 at 8:35

noob · Accepted Answer · 2011-11-23 08:49:47Z

5

just add dataType: "json" to your request, and you will get your data as object but this would just work if you put the return data into these brackets: []

otherwise use this

data21 = $.parseJSON('[' + data21.replace(/\"}/g, '"},').replace(/,$/, "") + ']');
console.log(data21);

example

edited Nov 23, 2011 at 8:49

answered Nov 23, 2011 at 8:37

noob

9,2224 gold badges40 silver badges65 bronze badges

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

1 Comment

priyanka Over a year ago

yaa i have added datatype bt its nt wrking and its giving same alerts

ianace · Accepted Answer · 2011-11-23 08:42:53Z

1

success: function(data) { 
data = jQuery.parseJSON(data);  
//now you can access the individual keys like alert(data.taskname+ " : "+data.projname)
    alert(data.taskname+ " : "+data.projname);
});

answered Nov 23, 2011 at 8:42

ianace

1,6352 gold badges17 silver badges32 bronze badges

1 Comment

priyanka Over a year ago

yaa i can access if it alerts only ...{"taskname":"Coding","projname":"Easy Wedding"}......bt its not working with multiples ...{"taskname":"Coding","projname":"Easy Wedding"} {"taskname":"Maintain","projname":"Easy Wedding"} {"taskname":"Flow Chart","projname":"Fnn"}

Edgar · Accepted Answer · 2011-11-23 09:03:31Z

0

As long as the JSON is valid, you should be able to access the object array with indexes.

If this is the data being returned:

[
    {"taskname":"Coding","projname":"Easy Wedding"},
    {"taskname":"Maintain","projname":"Easy Wedding"},
    {"taskname":"Flow Chart","projname":"Fnn"},
    {"taskname":"development in ","projname":"Fnn"},
    {"taskname":"flow chart","projname":"Art gallery"}
]

Then this will work:

$.ajax({
    type: "POST",
    url: "http://localhost:8888/CodeIgniter/index.php/user/usercontroller/search",
    cache: false,
    dataType: "json",
    data: { "responsible1":res1 },
    success: function(data) { 
        alert(data[0].taskname);
    });
});

edited Nov 23, 2011 at 9:03

answered Nov 23, 2011 at 8:49

Edgar

4,5285 gold badges44 silver badges64 bronze badges

Comments

Vikas Naranje · Accepted Answer · 2011-11-23 09:48:38Z

0

May be this help you.

var  t = { 
   'rows': [
        {"taskname":"Coding","projname":"Easy Wedding"},
        {"taskname":"Maintain","projname":"Easy Wedding"},
        {"taskname":"Flow Chart","projname":"Fnn"},
        {"taskname":"development in ","projname":"Fnn"},
        {"taskname":"flow chart","projname":"Art gallery"}
    ]
}



$.each(t.rows,function(index,value){
    for(var i in value){
        alert(i+' -> '+value[i]);
    }
});

This is the way to read json data that i think. Where t is containing json data

EDIT :

I'm not familiar with codeigniter but if you put below code in plain php file and run it you will find the result you are looking for.

<?php
    $arr = array();
    $arr[] = array('taskname'=>'Coding','projname'=>'Easy Wedding');
    $arr[] = array('taskname'=>'Maintain','projname'=>'Easy Wedding');
    $arr[] = array('taskname'=>'Flow Chart','projname'=>'Fnn');
    $arr[] = array('taskname'=>'development in','projname'=>'Art gallery');
    echo json_encode(array('rows'=>$arr));
?>

It will create same json data as i created in javascript t variable.

edited Nov 23, 2011 at 9:48

answered Nov 23, 2011 at 8:58

Vikas Naranje

2,4126 gold badges31 silver badges41 bronze badges

3 Comments

priyanka Over a year ago

how should i return json in correct format may be i am making mistake there so things are not working.. i want json to be returned as [ {"taskname":"Coding","projname":"Easy Wedding"}, {"taskname":"Maintain","projname":"Easy Wedding"}, {"taskname":"Flow Chart","projname":"Fnn"}, {"taskname":"development in ","projname":"Fnn"}, {"taskname":"flow chart","projname":"Art gallery"} ]

Vikas Naranje Over a year ago

@ianace it's json_encode(). for further information you can check php.net/manual/en/function.json-encode.php

Vikas Naranje Over a year ago

@ianace i'm not encoding json. I'm encoding php array name $arr. json_encode() will create javascript equivalent object( in this case json). that you can get in your ajax success call and iterate it to get your result.

Perception · Accepted Answer · 2013-01-13 05:45:14Z

0

Here is some code that may help:

From JSON to CI

1) CODEIGNITER

public function selectDetalleSolicitudByIdCliente() {
    $this->cliente_model->id_cliente = $_POST['id_cliente'];
    $data["cliente_detalle"] = $this->cliente_model->selectDetalleSolicitudByIdCliente();
    echo json_encode($data);
}

2) JQUERY

$.post(
    "cliente/selectDetalleSolicitudByIdCliente",
    {
        id_cliente: id_cliente
    },
    function(respuesta){
        $("#reporte2").html(">>" + respuesta);

        var respuesta = jQuery.parseJSON(respuesta);//parse json

        $.each(respuesta.cliente_detalle,function(index,value){
            for(var i in value){
                alert(i+' -> '+value[i]);
            }
     });
});

edited Jan 13, 2013 at 5:45

Perception

80.8k19 gold badges190 silver badges197 bronze badges

answered Jan 13, 2013 at 5:20

Diego Matos

1

Collectives™ on Stack Overflow

Accessing individual values from json array in jquery ajax

5 Answers 5

1 Comment

1 Comment

Comments

3 Comments

From JSON to CI

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

1 Comment

1 Comment

Comments

3 Comments

From JSON to CI

Comments

Your Answer

Sign up or log in

Post as a guest

Related