How to check existance of the XML element value in Javascript

Question

I have XML stored in the variable 'ad' and 'addd'.

Variable 'ad':

<?xml version="1.0" encoding="UTF-8"?>
<name>
<data>
<Id>003</Id>
 </data>
<data>
<Id>006</Id>
</data>
 ....
</name>

And Variable 'addd':

<?xml version="1.0" encoding="UTF-8"?>
<name>
<data>
<Id>009</Id>
</data>
<data>
<Id>005</Id>
</data>
...
</name>

I have written a ttt function:

function ttt(ad,addd) {
var match = ad.match(/<Id\/>/);
var matcht = addd.match(/<Id\/>/);
if ((! match || match.length == 0) && (! matcht || matcht.length == 0)){
    return "Below is the details of the Id of ad:\n\n" + ad.split("<Id>")[1].split("</Id>")[0]; + "\n\n And, Below is the details of the Id of addd:\n\n" +addd.split("<Id>")[1].split("</Id>")[0];
}

}

I need If Id is not blank from 'ad' variable then return alert as error with Id as below:

<?xml version="1.0" encoding="UTF-8"?>
<name>
<data>
<Id>003</Id>
</data>
<data>
<Id>006</Id>
</data>
</name>

And, I need If Id is not blank from 'addd' variable then return alert as error with Id as below:

<?xml version="1.0" encoding="UTF-8"?>
<name>
<data>
<Id>009</Id>
</data>
<data>
<Id>005</Id>
</data>
</name>

@Bergi I did by this only. but that is not providing as per expected output — NL1, Oct 05 '16 at 09:46

score 1 · Accepted Answer · edited May 23 '17 at 12:19

This may be an overkill, but I like the XSL approach anyway and it works. I found it also good for educational purposes.

You can create an XSL stylesheet and fetch all the values you are interested in. So, the XSL would look like this:

<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
  <xsl:template match="/name">
  <html>
  <body>
      <xsl:for-each select="data">
        <div><xsl:value-of select="Id" /></div>
      </xsl:for-each>
    </body>
  </html>
  </xsl:template>
</xsl:stylesheet>

With XPATH I reach to the name node. Then, I loop through all the data nodes and select the Id of their children. Value is added into a div. You can query that later as you can see and get the values.

Three things to note: You have XML stored as a string variable, so you need to make it a Node. DomParser is your friend.

  var parser = new DOMParser();
  var adXmlDoc = parser.parseFromString(ad, "text/xml");
  var adddXmlDoc = parser.parseFromString(addd, "text/xml");

Also, you need to load the XSL file, in the example I am just fetching it through XMLHttpRequest.

var xsl = loadXMLDoc(file);
  var xsltProcessor = new XSLTProcessor();
  xsltProcessor.importStylesheet(xsl);

I added as well a function to retrieve the transformed document from XSLT transformation:

function getDocument(xsltProcessor, xmlDoc, name) {
    var ownerDocument = document.implementation.createDocument("", name, null);
    return xsltProcessor.transformToDocument(xmlDoc, ownerDocument);
}

Now, you can query through the document, get the values you are interested in and implement your logic. In the example I am spitting all the HTML fragments in DOM for display. If node doesn't have any value (so Id returned nothing) an error is displayed.

function appendToDocument(selector, doc) {
  var container = document.querySelector(selector);
  var elements = doc.querySelectorAll("div");
  for (var i = 0; i < elements.length; i++) {
    if(!elements[i].innerHTML) {
      displayError(container);
    }
    container.innerHTML += elements[i].innerHTML + "</br>";
  }
}

Feel free to fiddle around and implement your logic based on the example. Hope this helps you.

Publicly accessible plunk

Also, some resources on XML and XSLT transformations:

How to check existance of the XML element value in Javascript

1 Answers1