PHP Developers Network
http://forums.devnetwork.net/

PHP Date picker to create a chart - not working properly
http://forums.devnetwork.net/viewtopic.php?f=1&t=144194
Page 1 of 1

Author:  Gigi [ Sat Sep 09, 2017 10:46 am ]
Post subject:  PHP Date picker to create a chart - not working properly

Hello everyone,

I created a chart by extracting values from database.
However, I need to add a date picker interval, so I can select the time range of extracted data.
I can select the start and end date from Calendar, but after pushing the button, the data is not filtered.
It extracts all the existing values in the table.
My code consists of 2 files:
data.php is used to get the data from database.
graph.php passes the data above to CanvasJS script, which renders the graph.

I really appreciate your help on solving this.
Thank you!

data.php
Syntax: [ Download ] [ Hide ]
<?php

header('Content-Type: application/json');
$conn = mysqli_connect("localhost", "root", "", "graphs");

if (mysqli_connect_errno($conn))
{
    echo "Failed to connect to DataBase: " . mysqli_connect_error();
}else
{
    $timestamp_at = "";
    $timestamp_at_to_date = "";

    $queryCondition = "";
    if(!empty($_POST["search"]["timestamp_at"])) {
            $timestamp_at = $_POST["search"]["timestamp_at"];
            list($fiy,$fim,$fid) = explode("-",$timestamp_at);

            $timestamp_at_todate = date('Y-m-d');
            if(!empty($_POST["search"]["timestamp_at_to_date"])) {
                    $timestamp_at_to_date = $_POST["search"]["timestamp_at_to_date"];
                    list($tiy,$tim,$tid) = explode("-",$_POST["search"]["timestamp_at_to_date"]);
                    $timestamp_at_todate = "$tiy-$tim-$tid";
            }

            $queryCondition .= "WHERE time BETWEEN '$fiy-$fim-$fid' AND '" . $timestamp_at_todate . "'";
    }

    $sql = "SELECT time, value1 from chart_data " . $queryCondition . " ORDER BY 1 asc";
    $sql = "select timestamp, value1  from data_table";
    $data_points = array();
   
    $result = mysqli_query($conn, "$sql");
   
    while($row = mysqli_fetch_array($result))
    {        
        $point = array("label" => $row['timestamp'] , "y" => $row['value1']);
       
        array_push($data_points, $point);        
    }
   
    echo json_encode($data_points, JSON_NUMERIC_CHECK);
}
mysqli_close($conn);

?>
 


graph.php:
Syntax: [ Download ] [ Hide ]
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title></title>
    <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
    <script src="https://canvasjs.com/assets/script/canvasjs.min.js"></script>
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">

    <script type="text/javascript">
        $(document).ready(function () {

            $.getJSON("data.php", function (result) {

                var chart = new CanvasJS.Chart("chartContainer", {
                    data: [
                        {
                            dataPoints: result
                        }
                    ]
                });

                chart.render();
            });
        });
    </script>
</head>
<body>

<div class="graph-display">
<h2>Graph with trend evolution:</h2>
  <form name="DatePicker" method="post" action="">
         <p class="search_input">
            <input type="text" placeholder="From Date" id="timestamp_at" name="search[timestamp_at]"  value="<?php echo $timestamp_at; ?>" class="input-control" />
            <input type="text" placeholder="To Date" id="timestamp_at_to_date" name="search[timestamp_at_to_date]" style="margin-left:10px"  value="<?php echo $timestamp_at_to_date; ?>" class="input-control"  />                    
            <input type="submit" name="go" value="Search" >
        </p>
    <div id="chartContainer" style="width: 800px; height: 380px;"></div>
  </form>
</div>

<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>

<script>
$.datepicker.setDefaults({
showOn: "button",
buttonImage: "datepicker.png",
buttonText: "Date Picker",
buttonImageOnly: true,
dateFormat: 'yy-mm-dd'  
});
$(function() {
$("#timestamp_at").datepicker();
$("#timestamp_at_to_date").datepicker();
});
</script>

</body>
</html>
 


Image

Author:  Celauran [ Sat Sep 09, 2017 12:12 pm ]
Post subject:  Re: PHP Date picker to create a chart - not working properly

Gigi wrote:
I can select the start and end date from Calendar, but after pushing the button, the data is not filtered.
It extracts all the existing values in the table.


Gigi wrote:
data.php
Syntax: [ Download ] [ Hide ]
<?php

header('Content-Type: application/json');
$conn = mysqli_connect("localhost", "root", "", "graphs");

if (mysqli_connect_errno($conn))
{
    echo "Failed to connect to DataBase: " . mysqli_connect_error();
}else
{
    $timestamp_at = "";
    $timestamp_at_to_date = "";

    $queryCondition = "";
    if(!empty($_POST["search"]["timestamp_at"])) {
            $timestamp_at = $_POST["search"]["timestamp_at"];
            list($fiy,$fim,$fid) = explode("-",$timestamp_at);

            $timestamp_at_todate = date('Y-m-d');
            if(!empty($_POST["search"]["timestamp_at_to_date"])) {
                    $timestamp_at_to_date = $_POST["search"]["timestamp_at_to_date"];
                    list($tiy,$tim,$tid) = explode("-",$_POST["search"]["timestamp_at_to_date"]);
                    $timestamp_at_todate = "$tiy-$tim-$tid";
            }

            $queryCondition .= "WHERE time BETWEEN '$fiy-$fim-$fid' AND '" . $timestamp_at_todate . "'";
    }

    $sql = "SELECT time, value1 from chart_data " . $queryCondition . " ORDER BY 1 asc";
    /** You're overwriting the above query with this one, always returning everything in the table **/
    $sql = "select timestamp, value1  from data_table";
    $data_points = array();
   
    $result = mysqli_query($conn, "$sql");
   
    while($row = mysqli_fetch_array($result))
    {        
        $point = array("label" => $row['timestamp'] , "y" => $row['value1']);
       
        array_push($data_points, $point);        
    }
   
    echo json_encode($data_points, JSON_NUMERIC_CHECK);
}
mysqli_close($conn);

?>
 

Author:  Gigi [ Sat Sep 09, 2017 1:16 pm ]
Post subject:  Re: PHP Date picker to create a chart - not working properly

That is not the issue, it was for testing purposes only.
If I remove the line, nothing changes.

Page 1 of 1 All times are UTC - 5 hours
Powered by phpBB® Forum Software © phpBB Group
http://www.phpbb.com/