Creating JavaScript variable within PHP retrieving in JavaScript - php

Question

Basically what I have is, there is an index file, that links to a JS file, which then pulls in a PHP file.
So in the PHP file I have (along with other code) :
echo " <script type='text/javascript'>var paging = [ ";
echo "{";
echo "numrows:'" . number_format($numrows) . "',";
echo "pagenum:'" . number_format($pagenum) . "',";
echo "maxpage:'" . number_format($maxpage) . "',";
echo "record_min:'" . number_format($record_min) . "',";
echo "record_max:'" . number_format($record_max) . "'";
echo "}];</script>";
Then, in a JS file I use ajax:
req.open("GET", "server.php", true);
and within the readystatechange I need to retrieve that paging variable you see from the php file because it contains data from the database.
In the JS file I have tried using a variable instead of echo
var m=<?PHP echo $paging; ?>
but that doesn't work either.
Any suggestions or ideas how to get this to work?

Answer 1

I'd use JSON instead of JS. You should be able to pass a PHP array to the json_encode function. See: http://php.net/manual/en/function.json-encode.php
Also, on the PHP side, you may want to modify your response headers to indicate that the response message body is JSON:
header( 'Content-Type: application/json' );
Then, use jQuery to get the JSON from the server: http://api.jquery.com/jQuery.getJSON/

Answer 2

Another possible solution for you if you don't get direct JSON working (scaled down to two variables)
echo '<div id = "numrows">'. number_format($numrows) . '</div>';
echo '<div id = "pagenum">'. number_format($pagenum) . '</div>';
in the php file
req.onreadystatechange = function(){
if (req.readyState == 4 && req.status == 200){
document.getElementById('return').innerHTML = req.responseText;
}
}
req.open("GET", "server.php", true);
req.send();
n["numrows"] = document.getElementById("numrows").innerHTML;
e = document.getElementByID("numrows");
e.parentNode.removeChild(e);
n["pagenum"] = document.getElementById("pagenum").innerHTML;
e = document.getElementByID("pagenum");
e.parentNode.removeChild(e);
in the javascript
<div id = "return" style="display: none;"></div>
in the html
Not the most elegant solution, but fairly straightforward to follow if you can't get anything else working.

Answer 3

Ok because jQuery makes this easy, here is my example:
$paging = array(
"numrows" => number_format($numrows),
"pagenum" => number_format($pagenum),
"maxpage" => number_format($maxpage),
"record_min" => number_format($record_min),
"record_max" => number_format($record_max)
);
$output = json_encode($paging);
header( 'Content-Type: application/json' );
echo $output;
Then in your javascript page using jquery do this:
function myCallBackFunction(data){
alert(data.numrows);
}
$.getJSON('server.php',myCallBackFunction(data));
Hope this helps.
Edited to use array and json_encode