CODEWITHSUNDEEP
javascriptajaxdominnerhtml
John Verber
John Verber

Reputation: 755

xmlhttp.responseText not outputting to innerHTML

I'm trying to familiarize myself with Ajax as I will need to use it continually for work. I'm working through the W3Schools tutorial trying things with my Apache2 server. I have a file called ajax_info.txt on the server (under /var/www (ubuntu)). I'm making a call to it and with Firebug I see I get a good response (4 & 200) but it isn't outputting the contents of the file to the DOM. Here's the code:

<!DOCTYPE html>
<html>
    <head>
        <script>
        var xmlhttp;
        var url = "http://192.168.0.5/ajax_info.txt";

        function loadXMLDoc(url, cfunc) {
            if (window.XMLHttpRequest) { // code for IE7+, Firefox, Chrome, Opera, Safari
                xmlhttp = new XMLHttpRequest();
            } else { // code for IE6, IE5
                xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
            }
            xmlhttp.onreadystatechange = cfunc;
            xmlhttp.open("GET", url, true);
            xmlhttp.send();
        }
        function myFunction() {
            loadXMLDoc(url, function () {
                if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
                    document.getElementById("myDiv").innerHTML = xmlhttp.responseText;
                }
            });
        }
        </script>
    </head>
    <body>
        <div id="myDiv">
            <h2>Let AJAX change this text</h2>
        </div>
        <button type="button" onclick="myFunction()">Change Content</button>
    </body>
</html>

I'm not exactly sure what it is I'm doing wrong. The w3schools tutorial isn't exhaustive by any stretch. I plan on buying a book, but I'd love to learn these simple GET calls as it will get me headed in the proper direction. Any suggestions would be greatly appreciated.

Upvotes: 1

Views: 4969

Answers (1)

NaWaKa
NaWaKa

Reputation: 11

function ajax(x) {

            var a;

            if (window.XMLHttpRequest) {
                a = new XMLHttpRequest();
            } else if (window.ActiveXObject) {
                a = new ActiveXObject("Microsoft.XMLHTTP");
            } else {
                alert("Browser Dosent Support Ajax! ^_^");
            }


            if (a !== null) {
                a.onreadystatechange = function() {
                    if (a.readyState < 4) {
                        //document.getElementById('cnt').innerHTML = "Progress";
                    } else if (a.readyState === 4) {
                        //respoce recived
                        var res = a.responseText;

                        document.getElementById('center_scrolling_div').innerHTML = res;
                        eval(document.getElementById('center_scrolling_div').innerHTML);
                    }
                };

                a.open("GET", x, true);
                a.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
                a.send();


            }

        }

Upvotes: 1

Related Questions