0

I want to retrieve(continuous) data from database using AJAX and pass it to a variable in JavaScript. However, I can't store them in an array. The value in the array is always undefined. Here are the codes:

My JavaScript file:

var counter = 0;
$(document).ready(function(){
  var pressure = [];
  var waterflow = [];
  var xhr;
  function execAjax(){
    if(xhr && xhr.readyState != 4){
      xhr.abort();
    }
    xhr = $.ajax({
      url: "controller/getrate.php",
      type: "GET",
      data: {current_location},
      success: (response) => {
        var data = JSON.parse(response);
        pressure[counter] = data.pressure[counter];
        waterflow[counter] = data.waterflow[counter];
        counter++;
      }
    });
  }
  setInterval(function(){
    execAjax();
  }, 5000);

  var data = {
    datasets:[{
    data: [pressure[0],pressure[1]]
    },
    data: [waterflow[0], waterflow[1]]
   ]
  }

  var dataSetA = oldData["datasets"][0]["data"];
  var dataSetB = oldData["datasets"][1]["data"];
  console.log(dataSetA);
  console.log(dataSetB);
});

My PHP File (getrate.php):

<?php 
 include 'db.php';

 $data = array(
  "loc_id" => array(),
  "pressure" => array(),
  "waterflow" => array(),
 );

 $getData = "SELECT * FROM tbl_rates LIMIT 10";
 $execGetData = mysqli_query($db, $getData);

 while($row = mysqli_fetch_array($execGetData)){
  array_push($data['loc_id'], $row['locationID']);
  array_push($data['pressure'], $row['pressure']);
  array_push($data['waterflow'], $row['waterflow']);
 }

 echo json_encode($data, JSON_PRETTY_PRINT);
?>

OUTPUT:

[undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined]
Stefan Becker
  • 5,695
  • 9
  • 20
  • 30
  • access like pressure.counter = data.pressure.counter; – Devsi Odedra Feb 11 '19 at 07:10
  • You will find your answer here: https://stackoverflow.com/questions/33285868/php-json-encode-multidimensional-associative-array and if that doesn't work, you can also json_encode your subarrays: $data['loc_id'] = json_encode($data['loc_id']); $data['pressure'] = json_encode($data['pressure']); $data['waterflow'] = json_encode($data['waterflow']); – andy Feb 11 '19 at 07:22

2 Answers2

0

I think you are doing mistake in success function.

success: (response) => {
    var data = JSON.parse(response);
    if(data.pressure.length>0){
         for(car i in data.pressure){
             pressure.push(data.pressure[i]);
         }
    }
    if(data.waterflow.length>0){
         for(car i in data.waterflow){
             pressure.push(data.waterflow[i]);
         }
    }
}

After this you can make custom dataset like

var data = {
    datasets:[
        {
             data: pressure
        },
        {
             data: waterflow
        }
   ]
};
var dataSetA = oldData.datasets[0].data;
var dataSetB = oldData.datasets[1].data;

console.log(dataSetA); console.log(dataSetB);

Haresh Vidja
  • 8,340
  • 3
  • 25
  • 42
0
  1. I was wondering if JSON.parse(response) was necessary as you are getting it already as the JSON object since the json_encode in your php will give you the JSON values. It may be breaking your code JSON.parse works only with string variables.

  2. I am afraid you are referring to oldData instead of variable data.

Jai
  • 91
  • 3