How to periodically fetch data from psql table

Question

I am fetching data from a psql table and passing it to javascript as json array for display as a time series chart. The data passed needs to be in the from of an array.

As the data in the table is updated periodically, I need to constantly fetch the data from psql e.g. every 15 minutes and pass updated array to javascript.

I search but so far I couldn't any solution. My question is how can I fetch data from psql periodically.

Here is my code:

<!DOCTYPE html>
<html lang="en">

<head>
    <script>
        var Device_Data;
        var time, batt;
        var timeArray = [];
        var battArray = [];
        var N = 12;
        for (i = 0; i < N; i++) {
            timeArray.push(0);
            battArray.push(0); }

    function dspChrt(Device_Data) { 

        console.log(Device_Data[0].date_time);
        console.log(Device_Data[1].battery_voltage_mv);

        time = Device_Data[0].date_time;
        batt = Device_Data[1].battery_voltage_mv;

        timeArray.shift();
        timeArray.push(time);
        battArray.shift();
        battArray.push(batt);

    </script>

</head>
<body> 

  <?php
    require("Connection.php");
    $stmt = $conn->prepare("Select date_time, battery_voltage_mv FROM measuring_device_statuses order by date_time desc limit 12");
    $stmt->execute();

    $result = $stmt->setFetchMode(PDO::FETCH_ASSOC);
    $WData = $stmt->fetchAll();

    /*
    echo "<pre>".print_r($WData, true)."</pre>"; 
    die();
    */

    ?>

    <script>
      var WData = <?php print_r(json_encode($WData));?>;
      //console.log(WData);
      dspChrt(WData);
    </script>
    </body>
</html>

check this link https://stackoverflow.com/questions/5052543/how-to-fire-ajax-request-periodically — Vitthal, Nov 08 '18 at 13:28

score 0 · Answer 1 · answered Nov 08 '18 at 13:25

0

Keep you data fetch php script in some file "fetch.php" and through javascript set interval function call it periodically for example this code prints alert every 3 secs.

setInterval(function(){ alert("Hello"); }, 3000);

answered Nov 08 '18 at 13:25

Muhammad Tashfeen

572
4
13

score 0 · Answer 2 · answered Nov 08 '18 at 13:28

You can use AJAX for this purpose.

HTML

<div id="myDiv"></div>

JavaScript

<script>

window.onload = function(){
loadDoc();
SetInverval(loadDoc, (10000 * 60 * 15)); // Perform function every fifteen minutes
}

function loadDoc() {
var div = document.getElementById("myDiv"); // Get Div
div.innerHTML = ""; // Set to nothing
  var xhttp = new XMLHttpRequest(); // Create new XML object
  xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) { // If successful
     div.innerHTML = this.responseText; // Display result
    }
  };
  xhttp.open("GET", "loadDoc.php", true);
  xhttp.send();
}

This should be in your PHP file, named loadDoc.php or whatever you choose to replace it to.

<?php
    require("Connection.php");
    $stmt = $conn->prepare("SELECT date_time, battery_voltage_mv FROM measuring_device_statuses ORDER BY date_time DESC LIMIT 12");
    $stmt->execute();

    //$result = $stmt->setFetchMode(PDO::FETCH_ASSOC);
    $WData = $stmt->fetchAll();
    $stmt->close();


    echo "<pre>".print_r($WData, true)."</pre>"; 
    die();


    ?>

@XCeptable No, the HTML code provided and JavaScript should not be in the same file. It should be in the location you are calling your original code from. — cmprogram, Nov 08 '18 at 13:34

How to periodically fetch data from psql table

2 Answers2