CODEWITHSUNDEEP
javascriptphpjqueryarraysajax
TheLovelySausage
TheLovelySausage

Reputation: 4094

JQuery AJAX retrieving an Array of Objects

I am trying to use json_encode so that my jquery ajax function can retrieve data from my php script however the array I am attempting to encode and retrieve is an array of objects

$la_uselessinfo = array();
$lv_cnt = 0;

$uselessinfo = pg_execute($gv_dbconn, "uselessinfo_cur", array());
while($la_row = pg_fetch_row($uselessinfo)) {

    $la_uselessinfo[$lv_cnt]["uinf_idno"] = $la_row[0];
    $la_uselessinfo[$lv_cnt]["uinf_desc"] = $la_row[1];
    $lv_cnt = $lv_cnt + 1;

}

echo json_encode($la_uselessinfo);

I am trying to retrieve this using the jquery ajax function

$.ajax({
    url     : 'scripts/phpfunctions.php',
    type    : 'GET',
    data    : {'action':'sel_uselessinfo'},
    success : function(data) {
                  //console.log(data);
                  console.log(data["uinf_desc"][0]);
              },
    error   : function(log) {
                  console.log(log.message);
              }
});

I am getting the following error

Uncaught TypeError: Cannot read property '0' of undefined

I can't tell if it's going wrong in the php code or the jquery code, what is the correct way to retrieve an array of objects?

Upvotes: 1

Views: 114

Answers (2)

Wesley Smith
Wesley Smith

Reputation: 19571

Change your PHP to:

$la_uselessinfo = array();
$lv_cnt = 0;

$uselessinfo = pg_execute($gv_dbconn, "uselessinfo_cur", array());
while($la_row = pg_fetch_row($uselessinfo)) {

    $la_uselessinfo[$lv_cnt]["uinf_idno"] = $la_row[0];
    $la_uselessinfo[$lv_cnt]["uinf_desc"] = $la_row[1];
    $lv_cnt = $lv_cnt + 1;

}

echo json_encode($la_uselessinfo); //$la_uselessinfo is already an array, no need to wrap it again, and doing so causes you to misjudge the depth of your array

Then change your jQuery to : 

$.ajax({
    url     : 'scripts/phpfunctions.php',
    type    : 'GET',
    data    : {'action':'sel_uselessinfo'},
    success : function(data) {
                  //console.log(data);
                  console.log(data[0]["uinf_desc"]); // this line changed
              },
    error   : function(log) {
                  console.log(log.message);
              }
});

To loop over your results do this:

 // sample data
var data = [{
  "uinf_idno": "1",
  "uinf_desc": "website db "
}, {
  "uinf_idno": "2",
  "uinf_desc": "local apache "
}]



$.each(data,function(i,e){
       var uinf_idno = e.uinf_idno;
       var uinf_desc = e.uinf_desc;
       
      $('#result').append('uinf_idno= '+uinf_idno+' and uinf_desc= '+uinf_desc+' <br>');
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div id="result"></div>

Upvotes: 1

void
void

Reputation: 36703

$.ajax({
    url     : 'scripts/phpfunctions.php',
    type    : 'GET',
    data    : {'action':'sel_uselessinfo'},
    dataType: "json",
    success : function(data) {
                  console.log(data[0]["uinf_desc"]);
                  console.log(data[0]["uinf_desc"]);
              },

It should be data[0]["uinf_desc"] as written in your PHP

Upvotes: 1

Related Questions