php return array into javascript

Question

I did a search but I am still confused as I am really new to php and ajax, so I was hoping someone can help me.

Im am using a php script within some ajax to access a database. I can echo the data to replace an element on the webpage. However I want to receive the data as an array to manipulate again in javaScript.

Here is the php

<?php $q=$_GET["q"];

$con = mysql_connect('server', 'name', 'pass'); if (!$con) //don't connect {    die('Could not connect: ' . mysql_error()); //give error }

mysql_select_db("database", $con); //select the MySQL database

$sql="SELECT * FROM table WHERE field = '".$q."'";

$result = mysql_query($sql); //$result is an array

$response = $result;

echo json_encode($response); 

echo "<table border='1'>
<tr>
<th>Heading1</th>
<th>Heading2</th>
<th>Heading3</th>
</tr>";

while($row = mysql_fetch_array($result))
  {
  echo "<tr>";
  echo "<td>" . $row['field1'] . "</td>";
  echo "<td>" . $row['field2'] . "</td>";
  echo "<td>" . $row['field3'] . "</td>";
  echo "</tr>";
  }
echo "</table>";

mysql_close($con);

?>

and he is the ajax/jScript used to call the php script.

function func(var)
{
xmlhttp = new XMLHttpRequest();

    xmlhttp.onreadystatechange=function()
    {
        if (xmlhttp.readyState==4 && xmlhttp.status==200) //ready
        {
            document.getElementById("div2").innerHTML=xmlhttp.responseText;

        }
    }
xmlhttp.open("GET","getTest.php?q=" + var,true);
xmlhttp.send();
}

As you can see it replaces div2 with a table with the info. But how can I instead receive the data as an array in jScript?

Cheers

Answer 1

You should look into JSON if you really got complicated objects

Answer 2

As Marc B says, the result of an SQL query is a result handle that you need to read from in order to then JSON encode:

// run the query
$result = mysql_query("SELECT * FROM table WHERE field = '{$q}'");

// fetch all results into an array
$response = array();
while($row = mysql_fetch_assoc($result)) $response[] = $row;

// save the JSON encoded array
$jsonData = json_encode($response); 

In your script, use something like the following to merge that JSON into the JavaScript:

<script>
  var data = <?= $jsonData ?>;
  console.log(data); // or whatever you need to do with the object
</script>

Answer 3

<script>
var foo = <?php echo json_encode($arr); ?>;
</script>