Passing PHP $result data to Javascript

Question

Here is PHP code that I am using to read values from my MySQL database.

I am accesing the values stored in my table 'data'. I want to read all the data present in the column 'val' and them pass them to JavaScript.

<?php
mysql_connect("localhost", "root", "root") or die(mysql_error()); 
mysql_select_db("db") or die(mysql_error()); 

$query = "SELECT data.val from data"; 

$i=0;    
$result = mysql_query($query) or die(mysql_error());

$i=0;    
$result = mysql_query($query) or die(mysql_error());
while ($row = mysql_fetch_array($result))
{
echo $row[$i];
echo "<br />";
}

?>

I now want to pass the values in $result to JavaScript, I am plotting a graph with the values by making use of D3.js.

Once posted I am making use of a var array store the points that need to be plotted on the graph.

How do I post the data from PHP to JavaScript?

you can use AJAX or put it the value in a element then let your javascript/jquery to get that value or assign them in script — Drixson Oseña, Aug 14 '13 at 04:13
@deceze the item you linked to as a duplicate is not the same thing (although the item it further links to as a duplicate is). In the one you linked, the user is only trying to pass a string from PHP to JS. The OP here is trying to pass an array or object. — JAAulde, Aug 14 '13 at 04:16
The point of marking duplicate is to direct someone to an answer which already exists and which solves their problem. People love to vote to close questions, and this one certainly should be closed as dup, but doing so requires a little legwork. The point is to help the OP, even when closing a question. Anyway, I wasn't nasty with you about it, just observing that it wouldn't solve the OP's problem. — JAAulde, Aug 14 '13 at 11:03

JAAulde · Answer 1 · 2013-08-14T04:20:05.377

I like to "inject" PHP into JS as the parameter to an Immediately Invoked Function Expression (IIFE).

Given a PHP array as such:

<?php
$data = array(
    'key1' => 'val1',
    'key2' => 'val2',
);
?>

I do the following:

<script>
    (function (data) {
        /*
         * Code in here now has access to the variable, data, which is a JS object like:
            {
                key1: 'val1',
                key2: 'val2'
            }
         */
    }(
        <?php echo json_encode($data); ?>
    ));
</script>

PHP's json_encode() is the real magic in this as it serializes PHP structures into JSON. The JSON in my example is simple enough that it can be treated as JS instead of of a string which would need parsing.

The other thing--the IIFE, simply consolidates any areas I'd need to step in and out of PHP (if I had other things to inject as well) into one area and localizes the code using the "injected" data.

I'm reading the data from MySQL using a while loop as the data will be entered by a third party and I don't know how many entries will be present. So how could I work around that? — Anon, Aug 14 '13 at 04:23
Build the array in your loop, pass it to JS as I showed. My example array was just to have something to show you. — JAAulde, Aug 14 '13 at 11:05

Passing PHP $result data to Javascript

1 Answers1