Plz help.. i want to limit it

JavaScript
1

i have this txt file name contacts.txt that contains this:

kate|female|kathryn bailey beckinsale|26-jul-1973|#23 underworld drive|(621) 142-7827|kate@lycans.net
jessica|female|jessica claire biel|03-mar-1982|27 texas avenue|(53)2344223|jbiel@yahoo.com
johnny|male|john christopher depp ii|09-jun-1963|711 pirate road|(773) 476-6634|jsparrow@piratebay.org

my script is this:

function syncText() {
var xhr = new XMLHttpRequest();

            xhr.open("get", "data/contacts.txt", false);

            xhr.send(null);

            if (xhr.status == 200) {
                var data = xhr.responseText;
                var items = data.split("|");
                items.sort();

                var div = document.getElementById("header2");
                for (var i = 0; i < items.length; i++) {
                    var p = document.createElement("p");
                    var text = document.createTextNode(items[i]);
                    p.appendChild(text);
                    div.appendChild(p);
                }
            } else {
                alert("data retrieval failed...");
            }
        }

html

<div id=“header2”>
<button onclick=“syncText()”>Pak</button>
</div>

i only want to retreive kat, jessica, johnny… please help me

2

Hi there RakiZtahX,

Welcome to the forums :slight_smile:

It would be better for you if your AJAX request was returning JSON, as opposed to a lump of text.
Maybe this is something for you to think about.

Anyway, as it is you need to do the following:[LIST]
[]Fetch the contents of the text file using AJAX and store the response in a variable called ‘data’
[]The way to distinguish between “records” is that they are separated by a newline, therefore if you do: var items = data.split("\ ");, you then have an array of records.
[]Then, loop through the array of records and split each record at the pipe character: els = items[i].split("|");. This gives you a further array of the record’s “attributes”.
[]Then select the first element in your new array, which is the name you are after, append it to a DocumentFragment
[*]Repeat this for all of your “records” and stick the fragment back into the DOM.
[/LIST]Here’s an example:

<!DOCTYPE HTML>
<html>
  <head>
    <!--http://www.sitepoint.com/forums/showthread.php?971960-Plz-help-i-want-to-limit-it-->
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Format AJAX response text</title>
  </head>
  
  <body>
    <div id="header2">
      <button onclick="syncText()">Pak</button>
      <ul id="list"></ul>  
    </div>
    
    <script>
      function syncText() {
        var xhr = new XMLHttpRequest();
        xhr.open("get", "contacts.txt", false);
        xhr.send(null);
        
        if (xhr.status == 200) {
          var data = xhr.responseText;
          var items = data.split("\
");
          var frag = document.createDocumentFragment();
          for (i=0; i<items.length; i++){
            els = items[i].split("|");
            li = document.createElement("li");
            li.innerHTML = els[0];
            frag.appendChild(li);
          }
          document.getElementById("list").appendChild(frag);
        } else {
          alert("data retrieval failed...");
        }
      }
    </script>
  </body>
</html>

I hope this helps you.

3

thank you…

4