Hey, fellas. I have just started LEARNING AJAX. I am having prblems in the first website only. So this website is like a restaurant menu, which tells you the avaible food. With respect to the user's query.

But its not displaying the end result. As i think, it is not reaching till the lastfile.

I am uploading the codes for all the php, javascript, and html files.

THE HTML FILE (NOTHING SPECIAL :P) [FOODSTORE.HTML]:

<!DOCTYPE html>
<html>
<head>
    <script type="text/javascript" src="foodstore.js"> </script>
</head>
    <body>
        <input type="text" id="userInput" onkeyup="process()" />
        <div id="underInput" />
    </body>
</html>

_____________________________________________________________________________
THE JAVASCRIPT FILE: [foodstore.js]:

var xmlHttp = createXmlHttpRequestObject();

function createXmlHttpRequestObject() {

    var xmlHttp;

    if (window.ActiveXObject){
        try{
            xmlHttp = new ActiveXObject("Microsofot.XMLHTTP");
        } catch (e) {
            xmlHttp = false;
        }
    }else{
        try{
            xmlHttp = new XMLHttpRequest();
        } catch (e) {
            xmlHttp = false;
        }
    }

    if (!xmlHttp) {
        alert("Could not create XML Object");
    } else {
        return xmlHttp;
    }
}




function process() {


        food = encodeURIComponent(document.getElementById("userInput").value);
        //alert(food);
        xmlHttp.open("GET", "foodstore.php?food="+food, true);
        xmlHttp.onreadystatechange = handleServerResponse;
        xmlHttp.send();

}

function handleServerResponse () {

    if ( xmlHttp.readyState==4 )
        if ( xmlHttp.status==200) {
        xmlResponse = xmlHttp.responseXML;
        xmlDocumentElement = xmlResponse.documentElement;
        message = xmlDocumentElement.firstChild.textContent;
        document.getElementById("underInput").innerHTML = '<span style="color:blue">' + message + '</span>';
    }
}

__________________________________________________________

the php file: [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('tuna','bacon','beef','loaf','ham');

        if (in_array($food,$foodArray)) {
            echo "We do have ".$food;
        } elseif ($food==''){
            echo "Enter food";
        } else {
            echo    "Sorry, we do not have ".$food;
        }

    echo '</response>';
?>

_______________________________________

Also, for clarification:

For the server factor, earlier I was using xampp. { ACTUALLY, I AM QUITE FAMILIAR WITH JAVASCRIPT AND PHP, but ajax is a very new topic for me}. Obviuosly it didnt work. So for experiment's sake , I registered on serverfree.com. But still no new development!

in case you WANT TO visit the file: => http://tattikhale.bugs3.com/foodstore.html

ALSO IF YOU ARE ABLE TO SOLVE THE ABOVE PROBLEM: PLEASE UPLOAD IT AND DO GIVE ME THE LINK.

THANKS IN ADVANCE....

P.S: PLEASE HELP THE NOOB. HE IS REALLY STUCK.. :(

Oh! I have solved it now , i was not using the ajax server properly!

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.