Requirement: make a account in 000webhosting to test this process
"index.html"
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="foodstore.js"></script>
</head>
<body onload="process()">
<h3>KFC Bucket</h3>
Enter the food you would like to order:
<input type="text" id="userInput"/>
<div id="underInput"/>
</body>
</html>
-------------------------------------------------------------------
"foodstore.php"
<?php
header('Content-Type: text/xml');
echo '<?xml version="1.0" encoding="UTF-8" standalone="yes" ?>';
echo '<response>';
$food = $_GET['food'];
$foodArray = array('pizza','burger','KFC','submarine','dramer','hotdog');
if(in_array($food,$foodArray))
echo 'We do have '.$food.'!';
elseif($food=='')
echo 'Enter a food you idiot';
else
echo 'Sorry punk we dont sell'.$food.'!';
echo '</response>';
?>
-------------------------------------------------------------------
"foodstore.js"
var xmlHttp = createXmlHttpRequestObject();
function createXmlHttpRequestObject(){
var xmlHttp;
//internet explorer
if(window.ActiveXObject){
try{
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}catch(e){
xmlHttp = false;
}
}
//google chrome
else{
try{
xmlHttp = new XMLHttpRequest();
}catch(e){
xmlHttp = false;
}
}
if(!xmlHttp)
alert("cant create that object!");
else(
return xmlHttp;
}
//process function on html
function process(){
if(xmlHttp.readyState==0 || xmlHttp.readyState==4){
food = encodeURIComponent(document.getElementById("userInput").value);
xmlHttp.open("GET", "foodstore.php?food=" + food, true");
xmlHttp.onreadystatechange = handleServerResponse;
xmlHttp.send(null);
}else{
setTimeout('process()',1000);
}
}
function handleServerResponse(){
if(xmlHttp.readyState==4){
if(xmlHttp.status==200){
xmlResponse = xmlHttp.responseXML;
xmlDocumentElement = xmlResponse.documentElement;
message = xmlDocumentElement.firstChild.data;
document.getElementById("underInput").innerHTML = '<span style="color:blue">' + message + '</span>';
setTimeout('process()',1000);
}else{
alert('Semething went wrong');
}
}
}
0 Comment to "How big meal restaurants make online order "
Post a Comment