Access.txt file data via Ajax

Asked

Viewed 148 times

2

I have an ajax + a txt simple script and can access the txt data, but I want to select the data of an array in ajax, example, search only the name or only the age. See the code;

<!DOCTYPE html>
<html>
    <head>
        <script>
            function loadXMLDoc(){
                var xmlhttp;
                if (window.XMLHttpRequest){// code for IE7+, Firefox, Chrome, Opera, Safari
                    xmlhttp=new XMLHttpRequest();
                } else {// code for IE6, IE5
                    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
                }
                xmlhttp.open("GET","ajaxnotxt.txt",false);
                xmlhttp.send();
                document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
            }
        </script>
    </head>
    <body>
        <div id="myDiv">
            <h2>Let AJAX change this text</h2>
        </div>
        <button type="button" onclick="loadXMLDoc()">Change Content</button>
    </body>
</html>

and has a txt called ajaxnotxt.txt that has a variable like this:

var carro = {tipo:"fiat", modelo:"500", cor:"branco"};

I want to access it like this:

document.getElementById("myDiv").innerHTML = xmlhttp.responseText;
carro.tipo;


I tried so:

document.getElementById("myDiv").innerHTML = xmlhttp.responseText.carro.tipo;

But it didn’t work. How to access certain data in txt with ajax?

javascript ajax
  • 1

    Sérgio’s solution solves his problem, but has already considered cleaning a server with a real DBMS?

  • 1

    Hi Adailton! If you want you can mark the answer as accepted.

1 answer

4


You have two ways to do that, and right now you’re trying an intermediate version that’s wrong.

If you have it in your file .txt javascript code as shown in the question:

var carro = {tipo:"fiat", modelo:"500", cor:"branco"};

then you can load this script not by ajax but by script append directly on the page. There the variable carro will be global and you can access as you want.

In that case the code shall be:

var script = document.createElement('script');
script.type = 'text/javascript';
script.src = 'ajaxnotxt.txt';
script.onload  = function() {
    document.getElementById("myDiv").innerHTML = carro.tipo;
}
document.body.appendChild(script);

If you want to use AJAX, then you should change in your file .txt to have only one JSON string that you can then use in Javascript.

So in the file you would have {"tipo":"fiat", "modelo":"500", "cor":"branco"} and in AJAX:

function loadXMLDoc() {
    var xmlhttp;
    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 = function () {
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
            var carro = JSON.parse(xmlhttp.responseText);
            document.getElementById("myDiv").innerHTML = carro.tipo;
        }
    }
    xmlhttp.open("GET", "ajaxnotxt.txt", false);
    xmlhttp.send();
}

This way is better and does not export variables to global space...

Browser other questions tagged javascript ajax

You are not signed in. Login or sign up in order to post.