While requesting for the data parsing the request and then providing the response is mainly done by using the TCP/IP model.
We need to ensure that it is being done while making the HTTP request and the HTTP response.
These are the records which we want to fetch from the script file or the database .
{
"records": [
{
"Name" : "Himanshu Joshi",
"City" : "Dehradun",
"Country" : "India"
},
{
"Name" : "Berglunds snabbkp",
"City" : "Lule",
"Country" : "Sweden"
},
{
"Name" : "Centro comercial Moctezuma",
"City" : "Mxico D.F.",
"Country" : "Mexico"
},
{
"Name" : "Ernst Handel",
"City" : "Graz",
"Country" : "Austria"
},
{
"Name" : "FISSA Fabrica Inter. Salchichas S.A.",
"City" : "Madrid",
"Country" : "Spain"
},
{
"Name" : "Galera del gastrnomo",
"City" : "Barcelona",
"Country" : "Spain"
},
{
"Name" : "Island Trading",
"City" : "Cowes",
"Country" : "UK"
},
{
"Name" : "Kniglich Essen",
"City" : "Brandenburg",
"Country" : "Germany"
},
{
"Name" : "Laughing Bacchus Wine Cellars",
"City" : "Vancouver",
"Country" : "Canada"
},
{
"Name" : "Magazzini Alimentari Riuniti",
"City" : "Bergamo",
"Country" : "Italy"
},
{
"Name" : "North/South",
"City" : "London",
"Country" : "UK"
},
{
"Name" : "Paris spcialits",
"City" : "Paris",
"Country" : "France"
},
{
"Name" : "Rattlesnake Canyon Grocery",
"City" : "Albuquerque",
"Country" : "USA"
},
{
"Name" : "Simons bistro",
"City" : "Kbenhavn",
"Country" : "Denmark"
},
{
"Name" : "The Big Cheese",
"City" : "Portland",
"Country" : "USA"
},
{
"Name" : "Vaffeljernet",
"City" : "rhus",
"Country" : "Denmark"
},
{
"Name" : "Wolski Zajazd",
"City" : "Warszawa",
"Country" : "Poland"
}
]
}
We will make sure that these things will be done by the HTTP req uest that is we included the constraint in our code.
This will ensure that the call that is being made by the HTTP will only be entertained otherwise not.
<!DOCTYPE html>
<html>
<head>
<title>Customers</title>
<link href="site.css" rel="stylesheet">
</head>
<body>
<nav id="nav01"></nav>
<div id="main">
<h1>Customers</h1>
<div id="id01"></div>
<footer id="foot01"></footer>
</div>
<script src="script.js"></script>
<script>
var xmlhttp = new XMLHttpRequest();
var url = "http://mydemo.com/website/customers.php";
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
myFunction(xmlhttp.responseText);
}
}
xmlhttp.open("GET", url, true);
xmlhttp.send();
function myFunction(response) {
var obj = JSON.parse(response);
var arr = obj.records;
var i;
var out = "<table><tr><th>Name</th><th>City</th><th>Country</th></tr>";
for(i = 0; i < arr.length; i++) {
out += "<tr><td>" +
arr[i].Name +
"</td><td>" +
arr[i].City +
"</td><td>" +
arr[i].Country +
"</td></tr>";
}
out += "</table>"
document.getElementById("id01").innerHTML = out;
}
</script>
</body>
</html>
0 Comment(s)