increasing php variable in javascript loop

Question

Im trying to create a display of charts using chartJS that are dynamic in both the number of charts displayed and its contents. I am stuck as to how to iterate through the result set in php while looping through the creation of charts in javascript. I know that Javascript is processed client side and php is processed server side. I wrote this code to give you guys a general idea of what i am trying to do. Right now the counter does not increase and i end up with the same graphs, whatever data that comes first in the array. In a sense, i need some way of tracking the var i in javascript within php to access the contents in my result set.

var charts = [];
    <?php $counter = 0; ?>

    for (var i = 0; i < <?php echo sizeOf($readingArray); ?>; i++) {
        var ctx = document.getElementById(i);
        charts[i] = new Chart(ctx, {
        type: 'line',
        data: {
            datasets: [{
            label: 'Actual Readings',
            data: <?php echo json_encode($readingArray[$counter][4], JSON_NUMERIC_CHECK); ?>,
        }, {
            label: 'Threshold',
            data: <?php echo json_encode($readingArray[$counter][5], JSON_NUMERIC_CHECK); ?>,
        }],
        labels: <?php echo json_encode($readingArray[$counter][3]);?>,

        },
        options: {
                zoom: {
                        enabled: true,
                        mode: 'x',
                },
                pan: {
                       enabled: true,
                       mode: 'x',
                },

        },
    });
    <?php $counter++; ?>
  }

Not possible by the same reason you mention yourself. *I know that Javascript is processed client side and php is processed server side.* — Andreas, May 16 '19 at 06:38
You can't do it that way. JS is executed on the client, PHP is executed on the sever - before its sent to the client. — Qirel, May 16 '19 at 06:38
Possible duplicate of [What is the difference between client-side and server-side programming?](https://stackoverflow.com/questions/13840429/what-is-the-difference-between-client-side-and-server-side-programming) — Qirel, May 16 '19 at 06:39
@Gulshan sizeof is an alias of count, meaning it's the same code doing the job. https://php.net/manual/en/function.sizeof.php — Andreas, May 16 '19 at 06:41

score 0 · Answer 1 · answered May 16 '19 at 06:42

You shout assign php variables to js variables and work with them. Something like this

var data = '<?php echo json_encode($readingArray); ?>';

Then convert json string to object

arrayOfObjects = JSON.parse(data)

After that iterate your data and print chart

for (var key in arrayOfObjects) {
console.log(arrayOfObjects[key])
}

increasing php variable in javascript loop

1 Answers1