⚠ī¸ Warning ⚠ī¸ Deprecated Code! This video tutorial contains outdated code.
💡 If you wish to update it, any AI assistant will update the code for you in seconds.

JSON Timed Ajax PHP MySQL Data Request Web Application

Published : November 17, 2014   •   Last Edited : November 24, 2025   •   Author : Adam Khoury
In this final lesson of the series we demonstrate how to request and parse JSON formatted PHP MySQL database data. To show the functionality we create a timed random MySQL JSON data request application using Ajax that you can run on your web pages. json_mysql_data.php 
<?php
header("Content-Type: application/json");
if(isset($_POST['limit'])){
	$limit = preg_replace('#[^0-9]#', '', $_POST['limit']);
	require_once("connect_db.php");
	$i = 0;
	$jsonData = '{';
	$sqlString = "SELECT * FROM tablename ORDER BY RAND() LIMIT $limit";
	$query = mysql_query($sqlString) or die (mysql_error()); 
	while ($row = mysql_fetch_array($query)) {
		$i++;
    	$id = $row["id"]; 
    	$title = $row["title"];
		$cd  = $row["creationdate"];
	    $cd = strftime("%B %d, %Y", strtotime($cd));
		$jsonData .= '"article'.$i.'":{ "id":"'.$id.'","title":"'.$title.'", "cd":"'.$cd.'" },';
	}
	$now = getdate();
    $timestamp = $now[0];
	$jsonData .= '"arbitrary":{"itemcount":'.$i.', "returntime":"'.$timestamp.'"}';
	$jsonData .= '}';
    echo $jsonData;
}
?>
JSON_tutorial_7.html 
<!DOCTYPE html>
<html>
<head>
<style>
div#databox {
	padding:12px;
	background: #F3F3F3;
	border:#CCC 1px solid;
	width:550px;
	height:310px;
}
</style>
<script>
var myTimer;
function ajax_json_data(){
	var databox = document.getElementById("databox");
	var arbitrarybox = document.getElementById("arbitrarybox");
    var hr = new XMLHttpRequest();
    hr.open("POST", "json_mysql_data.php", true);
    hr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    hr.onreadystatechange = function() {
	    if(hr.readyState == 4 && hr.status == 200) {
		    var d = JSON.parse(hr.responseText);
			arbitrarybox.innerHTML = d.arbitrary.returntime;
			databox.innerHTML = "";
			for(var o in d){
				if(d[o].title){
				    databox.innerHTML += '<p><a href="page.php?id='+d[o].id+'">'+d[o].title+'</a><br>';
					databox.innerHTML += ''+d[o].cd+'</p>';
				}
			}
	    }
    }
    hr.send("limit=4");
    databox.innerHTML = "requesting...";
	myTimer = setTimeout('ajax_json_data()',6000);
}
</script>
</head>
<body>
<h2>Timed JSON Data Request Random Items Script</h2>
<div id="databox"></div>
<div id="arbitrarybox"></div>
<script>ajax_json_data();</script>
</body>
</html>
▲