Search code examples
javascriptphpsession-storage

SessionStorage, get only last values


I have PHP file with this function and code:

<?php
   $valuesNight = select_sensor_data7($db, $idSensor, $date22y, $date6t);
    chart_line($valuesNight);

    $valuesEvening = select_sensor_data7($db, $idSensor, $date6t, $date14t);
    chart_line($valuesEvening);   
  ?>

<?php function chart_line($values7){ ?>
<div>
    <script type="text/javascript">

        var values7 = <?php echo $values7 ?>;
        var value7 = new Array;
        var time7 = new Array;

        for(var o in values7) {
            value7.push(values7[o]['dValue']);
            time7.push(values7[o]['dTimeDate']);
        }
        //alert(time7);
        // store values
        sessionStorage.setItem('myValues', JSON.stringify(value7));
        sessionStorage.setItem('myTime', JSON.stringify(time7));
    </script>

    <object type="text/html" data="chart.htm" width="100%"  height="420"></object>
</div>
<?php } ?>

And select_sensor_data7()

function select_sensor_data7($db, $idSensor, $dateFrom, $dateTo){
$stmt = $db->prepare("SELECT * FROM sensorData WHERE _idSensor = :idSensor 
                        AND dTimeDate BETWEEN :dateFrom AND :dateTo ORDER BY dTimeDate");
    $stmt->execute(array(':idSensor' => $idSensor, ':dateFrom' => $dateFrom, ':dateTo' => $dateTo));
    $row2 =$stmt->fetchAll(PDO::FETCH_ASSOC);
    $json=json_encode($row2);
return $json;
}

And in chart.htm:

<script type="text/javascript">
    var myTime = JSON.parse(sessionStorage.getItem('myTime'));
    var myValues = JSON.parse(sessionStorage.getItem('myValues'));

    alert(myTime);

Problem: select_sensor_data7 return object with values and time between dates, chart_line($valuesNight) and chart_line($valuesEvening) run function. In function chart_line($values7) alert(time7)shows me right values , but in chart.htm i get only last values valuesEvening.

Where am i doing wrong?


Solution

  • Before I continue, please consider using good naming convention, functions like select_sensor_data7 and variables like values7 are poor choices.

    Having said that; it looks like select_sensor_data7 function returns a json_encoded object array, i.e. something like this (dummy data):

    [
        {"dValue": "123", "dTimeDate": "00/00/0000"},
        {"dValue": "123", "dTimeDate": "00/00/0000"},
        {"dValue": "123", "dTimeDate": "00/00/0000"}
    ]
    

    So, what you could do in your PHP function is:

    <?php
    
    $valuesNight = select_sensor_data7($db, $idSensor, $date22y, $date6t);
    chart_line('night', $valuesNight);
    
    $valuesEvening = select_sensor_data7($db, $idSensor, $date6t, $date14t);
    chart_line('evening', $valuesEvening);   
    
    ?>
    
    <?php function chart_line($chartId, $jsonDataSource) { ?>
    <div>
        <script type="text/javascript">
    
            var dataSource = JSON.parse('<?php echo $jsonDataSource ?>');
            var dValues = new Array;
            var dTimeDate = new Array;
    
            for (var i = 0; i < dataSource.length; i++) {
                dValues.push(dataSource[i].dValue);
                dTimeDate.push(dataSource[i].dTimeDate);
            }
    
            sessionStorage.setItem($chartId .'_myValues', JSON.stringify(dValues));
            sessionStorage.setItem($chartId .'_myTime', JSON.stringify(dTimeDate));
    
        </script>
    
        <object type="text/html" data="chart.htm?chartId=<?php echo $chartId ?>" width="100%"  height="420"></object>
    </div>
    <?php } ?>
    

    Then you update your chart.html like this:

    <script type="text/javascript">
    
    // http://stackoverflow.com/a/901144/2332336
    function getParameterByName(name, url) {
        if (!url) url = window.location.href;
        name = name.replace(/[\[\]]/g, "\\$&");
        var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"),
            results = regex.exec(url);
        if (!results) return null;
        if (!results[2]) return '';
        return decodeURIComponent(results[2].replace(/\+/g, " "));
    }
    
    // Parse chartId
    var chartId = getParameterByName('chartId', location.href);
    
    // Proceed if you have a chart id
    if (typeof chartId !== 'undefined' && chartId && chartId.length > 0)
    {
        var myTime = JSON.parse(sessionStorage.getItem(chartId +'_myTime'));
        var myValues = JSON.parse(sessionStorage.getItem(chartId +'_myValues'));
    
        // TEST
        console.log('myTime', myTime);
        console.log('myValues', myValues);
    }
    else
    {
        alert('error - invalid chart id');
    }
    
    </script>
    

    P.S. Not tested, let me know if you have trouble running this.