Handling empty nodes in XML via AJAX

Question

I have this code to parse XML. How would I address an empty node in the XML? At present no output is delivered at all with the "v2" node being empty...

<script>
function loadDoc() {
  var xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
      myFunction(this);
    }
  };
  xhttp.open("GET", "sample.xml", true);
  xhttp.send();
}
function myFunction(xml) {
  var i;
  var xmlDoc = xml.responseXML;
  var table="<tr><th>c1</th><th>c2</th></tr>";
  var x = xmlDoc.getElementsByTagName("product");
  for (i = 0; i <x.length; i++) { 
    table += "<tr><td>" +
    x[i].getElementsByTagName("v1")[0].childNodes[0].nodeValue +
    "</td><td>" +
    x[i].getElementsByTagName("v2")[0].childNodes[0].nodeValue +
    "</td></tr>";
  }
  document.getElementById("demo").innerHTML = table;
}
</script>

XML:

<products>
    <product>
        <v1>some data</v1>
        <v2/>
    </product>
</products>

You say "At present no output is delivered at all with the "v2" node being empty" but what exactly is the problem? Do you expect something to come back? Is there an error you forgot to mention? — Andrew L
– Andrew L, Commented Apr 17, 2018 at 18:43
@AndrewLohr There's no error. Simply nothing loads at all. I would like the empty node to simply return empty value in the table cell. — user3101259
– user3101259, Commented Apr 17, 2018 at 19:35

Musa · Accepted Answer · 2018-04-17 20:08:51Z

Simply check if it is not empty then use the data otherwise just skip it.

function loadDoc() {
  var xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
      myFunction(this);
    }
  };
  xhttp.open("GET", `data:text/xml,<products>
    <product>
        <v1>some data</v1>
        <v2/>
    </product>
</products>`, true);
  xhttp.send();
}
function myFunction(xml) {
  var i;
  var xmlDoc = xml.responseXML;
  var table="<tr><th>c1</th><th>c2</th></tr>";
  var x = xmlDoc.getElementsByTagName("product");
  for (i = 0; i <x.length; i++) { 
    table += "<tr><td>" +
    x[i].getElementsByTagName("v1")[0].childNodes[0].nodeValue + "</td><td>";
    var v2c = x[i].getElementsByTagName("v2")[0].childNodes;
    if (v2c.length > 0){
      table += v2c[0].nodeValue;
    }
    table += "</td></tr>";
  }
  document.getElementById("demo").innerHTML = table;
}

<button onclick="loadDoc()">Load</button>
<table id="demo" border="1"></table>

Maybe I needed to check for the length of the childNodes property, my first assumption was that it would be undefined for an empty node
...I retracted my reply, regarding the fix... still having an issue with nothing loading
I worked out this on my end (below) and it works but yours as well. Thanks

user3101259 · Accepted Answer · 2018-04-17 20:22:08Z

0

own revision:

if (v2c.length > 0){
   table += v2c[0].nodeValue + "</td><td>";
} else {
   table += "</td><td>";
}

answered Apr 17, 2018 at 20:22

user3101259

919 bronze badges

Collectives™ on Stack Overflow

Handling empty nodes in XML via AJAX

2 Answers 2

3 Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

Comments

Related