Extra content at the end of the document - Ajax

Question

When I run my code this error appears :

This page contains the following errors:

error on line 2 at column 1: Extra content at the end of the document

Below is a rendering of the page up to the first error.

I made my code in two files: javascript and php like this:

<?php
    header('Content-Type: text/xml');
    echo '<?xml version="1.0" encoding="UTF-8" standalone="yes" ?>';

    echo '<response>';
        $food = isset($_GET['food']);
        $foodArray = array('tuna', 'bacon', 'beef');
        if(in_array($food, $foodArray)){
            echo 'We do have'.$food;
        }
        elseif($food==''){
            echo 'Enter a food';
        }else{
            echo 'We dont sell'.$food;
        }
    echo '</response>';
?>

<html>
    <head>
        <script src="index.js"></script>
    </head>
    <body onload="process()">
        <form method ="get" action="index.php"><input type="text" id="userInput"/></form>
        <div id="underInput"></div>
    </body>
</html>

and

var xmlHttp = createXmlHttpRequestObject();

function createXmlHttpRequestObject(){
    var xmlHttp;

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

    if(!xmlHttp){
        alert("Error")
    }else{
        return xmlHttp;
    }
}

function process(){
    if(xmlHttp.readyState == 0 || xmlHttp.readyState == 4){
        food = encodeURIComponent(document.getElementById("userInput").value);
        xmlHttp.open("GET", "index.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;
            xmlDocument = xmlResponse.documentElement;
            message = xmlDocumentElement.firstChild.dataa;
            document.getElementById("underInput").innerHTML = '<span style="color:blue">' + message + '</span>';
            setTimeout('process()', 1000);
        }else{
            alert("Error1");
        }
    }
}

Can somebody help?

Thanks

http://stackoverflow.com/questions/16972737/xml-parse-error-extra-content-at-the-end-of-the-document — Vishnu, Aug 24 '15 at 12:39

Prashant Tapase · Accepted Answer · 2015-08-24T14:05:02.307

The error comes because of html code.

Make different php file. Dont add html code in that

<?php
    header('Content-Type: text/xml');
    echo '<?xml version="1.0" encoding="UTF-8" standalone="yes" ?>';

    echo '<response>';
        $food = isset($_GET['food']);
        $foodArray = array('tuna', 'bacon', 'beef');
        if(in_array($food, $foodArray)){
            echo 'We do have'.$food;
        }
        elseif($food==''){
            echo 'Enter a food';
        }else{
            echo 'We dont sell'.$food;
        }
    echo '</response>';
?>

do changes in html file use keyup or any other function dont use onload functin

<html>
    <head>
        <script src="xml.js"></script>
    </head>
    <body>
        <form method ="get" action="test.php">
            <input type="text" id="userInput" onkeyup = "process();"/>
        </form>
        <div id="underInput"></div>
    </body>
</html>

codepad

when I tipe any food it should instantly return answer – CroVG Aug 24 '15 at 13:55 — CroVG, Aug 24 '15 at 13:55

Extra content at the end of the document - Ajax

1 Answers1