My problem seems to lie somewhere in between the subfunction calling of LoadXML. It seems that the xml data bees null for some weird reason, and I have no idea how to fix that. Stackexchange seemed to have loads of similar questions but many were unanswered or the answer they had did not help my case.

function load() {
    var xmlhttp;
    xmlhttp = new XMLHttpRequest();
    var idname = document.getElementById("name").value;
    xmlhttp.onreadystatechange = function () {
        if (this.readyState == 4 && this.status == 200) {
            console.log(this); //it obtains it here...
            LoadXML(this, idname);
        }
    };
    xmlhttp.open("GET", "helper_database.xml", false);
    xmlhttp.overrideMimeType('text/xml');
    xmlhttp.send();
}

function LoadXML(xml, name) {
    var x, i, xmlDoc, nametxt, areEqual;
    xmlDoc = xml.responseXML;
    nametxt = name;
    console.log("HERE \n" + xmlDoc); //...but it bees null.
    x = xmlDoc.getElementsByTagName("name"); //this returns the error of "Cannot read property 'getElementsByTagName' of null"
    console.log("muuttujan x eka: " + x[0]);
    for (i = 0; i < x.length; i++) {
        if (areEqual = xmlDoc.getElementsByTagName("name").toUpperCase() === nametxt.toUpperCase()) {
            document.getElementById("ComFocus").value = x[i];
        }
    }
}

Here is the helper_database.xml

<Character>
    <name>test</name>
    <stats>
        <Com>1</Com>
        <Con>2</Con>
        <Cun>3</Cun>
        <Dex>4</Dex>
        <Mag>5</Mag>
        <Per>6</Per>
        <Str>7</Str>
        <Wil>8</wil>
    </stats>
</Character>

My problem seems to lie somewhere in between the subfunction calling of LoadXML. It seems that the xml data bees null for some weird reason, and I have no idea how to fix that. Stackexchange seemed to have loads of similar questions but many were unanswered or the answer they had did not help my case.

function load() {
    var xmlhttp;
    xmlhttp = new XMLHttpRequest();
    var idname = document.getElementById("name").value;
    xmlhttp.onreadystatechange = function () {
        if (this.readyState == 4 && this.status == 200) {
            console.log(this); //it obtains it here...
            LoadXML(this, idname);
        }
    };
    xmlhttp.open("GET", "helper_database.xml", false);
    xmlhttp.overrideMimeType('text/xml');
    xmlhttp.send();
}

function LoadXML(xml, name) {
    var x, i, xmlDoc, nametxt, areEqual;
    xmlDoc = xml.responseXML;
    nametxt = name;
    console.log("HERE \n" + xmlDoc); //...but it bees null.
    x = xmlDoc.getElementsByTagName("name"); //this returns the error of "Cannot read property 'getElementsByTagName' of null"
    console.log("muuttujan x eka: " + x[0]);
    for (i = 0; i < x.length; i++) {
        if (areEqual = xmlDoc.getElementsByTagName("name").toUpperCase() === nametxt.toUpperCase()) {
            document.getElementById("ComFocus").value = x[i];
        }
    }
}

Here is the helper_database.xml

<Character>
    <name>test</name>
    <stats>
        <Com>1</Com>
        <Con>2</Con>
        <Cun>3</Cun>
        <Dex>4</Dex>
        <Mag>5</Mag>
        <Per>6</Per>
        <Str>7</Str>
        <Wil>8</wil>
    </stats>
</Character>

• javascript
• xml
• xmlhttprequest

Share Improve this question Follow edited Feb 21, 2017 at 9:20 George 6,74922 gold badges3030 silver badges3636 bronze badges asked Feb 21, 2017 at 9:07 PnPPnP 12511 gold badge11 silver badge77 bronze badges 5

• 1 It's just a typo (I'm surprised that you aren't getting an error in the web console, but I don't either): The XML is malformed: <Wil>8</wil> Note that the end tag is wil, not </Wil>. Fix that and it parses and responseXML is filled in. – T.J. Crowder Commented Feb 21, 2017 at 9:12
• 2 Rather than stumbling around in the dark with a console.log torch, I suggest turning on the lights using the fully-featured debugger built into your browser. Using that, you could look at this in your onreadystatechange handler and see that its responseXML property is null. – T.J. Crowder Commented Feb 21, 2017 at 9:12
• Like T.J. Crowder wrote it is a type in XML file. Additionally you will get problems on the equal check. xmlDoc.getElementsByTagName("name") is a collection so there will be no .toUpperCase(). You have to do something like that xmlDoc.getElementsByTagName("name")[i].innerHTML.toUpperCase() or shorter x[i].innerHTML.toUpperCase() – Klaus F. Commented Feb 21, 2017 at 9:21
• In addition to the other ments, given xmlhttp.open("GET", "helper_database.xml", false); which does a synchronous request, there is no need to set up an onreadystatechange event handler at all, you could as well try to process the response after the send() call. In general, you should try to use asynchronous requests by using xmlhttp.open("GET", "helper_database.xml", true), then the onreadystatechange handler at least makes sense. – Martin Honnen Commented Feb 21, 2017 at 9:28
• I appreciate very much all of these ments and feedback. I did not know that xml tags are case sensitive. – PnP Commented Feb 21, 2017 at 9:38

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 3

You have some typeo as well as some parsing errors.
Note that :

• getElementsByTagName().toUpperCase is invalid because gEBTN returns array of objects. so, you have to use getElementsByTagName()[i].innerHTML.toUpperCase().
• instead of using console.log("muuttujan x eka: " + x[0]);, use console.log("muuttujan x eka: " + x[0].innerHTML);

function load() {
  var xmlhttp;
  xmlhttp = new XMLHttpRequest();
  var idname = document.getElementById("name").value;
  xmlhttp.onreadystatechange = function() {
    if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
      console.log(xmlhttp); //it obtains it here...
      LoadXML(xmlhttp, idname);
    }
  };
  xmlhttp.open("GET", "helper_database.xml", false);
  //xmlhttp.overrideMimeType('text/xml');
  xmlhttp.send();
}

function LoadXML(xml, name) {
  var x, i, xmlDoc, nametxt, areEqual;
  xmlDoc = xml.responseXML;
  nametxt = name;
  console.log("HERE \n" + xmlDoc); //...but it bees null.
  x = xmlDoc.getElementsByTagName("name"); //this returns the error of "Cannot read property 'getElementsByTagName' of null"
  console.log("muuttujan x eka: " + x[0].innerHTML);
  for (i = 0; i < x.length; i++) {
    if (areEqual = xmlDoc.getElementsByTagName("name")[0].innerHTML.toUpperCase() === nametxt.toUpperCase()) {
      document.getElementById("ComFocus").value = x[i];
    }
  }
}

<html>
  <body>
    <input id="name" onblur="load();" />
    <div id="ComFocus"></div>
  </body>
</html>

XML

<?xml version="1.0" encoding="UTF-8"?>
<Character><name>test</name>
<stats>
<Com>1</Com>
<Con>2</Con>
<Cun>3</Cun>
<Dex>4</Dex>
<Mag>5</Mag>
<Per>6</Per>
<Str>7</Str>
<Wil>8</Wil>
</stats></Character>