CODEWITHSUNDEEP
javascriptjqueryxmlxml-parsing
Cesare
Cesare

Reputation: 1749

Parse xml with namespaces using JQuery and working for all browser ..

I'm trying to parse an XML response from a service using JQuery 1.11

At the moment my code works but only in Chrome, not for IE or Firefox and I need it works for all "modern" browsers.

Here you are a sample of my XML

<?xml version='1.0' encoding="ISO-8859-1" ?>
<wfs:FeatureCollection
   xmlns:ms="http://mapserver.gis.umn.edu/mapserver"
   xmlns:wfs="http://www.opengis.net/wfs"
   xmlns:gml="http://www.opengis.net/gml"
   xmlns:ogc="http://www.opengis.net/ogc"
   xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
   xsi:schemaLocation="http://www.opengis.net/wfs http://schemas.opengis.net/wfs/1.0.0/WFS-basic.xsd 
                       http://mapserver.gis.umn.edu/mapserver http://wms.pcn.minambiente.it/ogc?map=/ms_ogc/wfs/Numeri_Civici_2012.map&amp;SERVICE=WFS&amp;VERSION=1.0.0&amp;REQUEST=DescribeFeatureType&amp;TYPENAME=IN.NUMERICIVICI.2012&amp;OUTPUTFORMAT=XMLSCHEMA">
      <gml:boundedBy>
        <gml:Box srsName="EPSG:4326">
            <gml:coordinates>7.700007,44.802147 7.749396,44.849996</gml:coordinates>
        </gml:Box>
      </gml:boundedBy>
    <gml:featureMember>
      <ms:IN.NUMERICIVICI.2012 fid="IN.NUMERICIVICI.2012.2728384">

        <gml:boundedBy>
            <gml:Box srsName="EPSG:4326">
                <gml:coordinates>7.735138,44.810267 7.735138,44.810267</gml:coordinates>
            </gml:Box>
        </gml:boundedBy>
        <ms:boundary>
        <gml:Point srsName="EPSG:4326">
          <gml:coordinates>7.735138,44.810267</gml:coordinates>

        </gml:Point>
        </ms:boundary>
        <ms:id>13800026457291</ms:id>
        <ms:nome>Borgata Tetti Sotto</ms:nome>
        <ms:civico>16</ms:civico>
        <ms:istat>01004041</ms:istat>
        <ms:cap>12030</ms:cap>

        <ms:comune>CARAMAGNA PIEMONTE</ms:comune>
        <ms:nome_ted> </ms:nome_ted>
        <ms:provincia>CUNEO</ms:provincia>
        <ms:regione>PIEMONTE</ms:regione>
      </ms:IN.NUMERICIVICI.2012>
    </gml:featureMember>
    <gml:featureMember>

      <ms:IN.NUMERICIVICI.2012 fid="IN.NUMERICIVICI.2012.2736621">
        <gml:boundedBy>
            <gml:Box srsName="EPSG:4326">
                <gml:coordinates>7.735397,44.812403 7.735397,44.812403</gml:coordinates>
            </gml:Box>
        </gml:boundedBy>
        <ms:boundary>
        <gml:Point srsName="EPSG:4326">

          <gml:coordinates>7.735397,44.812403</gml:coordinates>
        </gml:Point>
        </ms:boundary>
        <ms:id>13800026457290</ms:id>
        <ms:nome>Borgata Tetti Sotto</ms:nome>
        <ms:civico>25</ms:civico>
        <ms:istat>01004041</ms:istat>

        <ms:cap>12030</ms:cap>
        <ms:comune>CARAMAGNA PIEMONTE</ms:comune>
        <ms:nome_ted> </ms:nome_ted>
        <ms:provincia>CUNEO</ms:provincia>
        <ms:regione>PIEMONTE</ms:regione>
      </ms:IN.NUMERICIVICI.2012>

    </gml:featureMember>

Here you are my code

var xmlText = $('#featureData').text(),
$xmlData = $.parseXML(xmlText),
$features = $('featureMember', $xmlData),
extractedFeatures = [];

$features.each(function () {
var $this = $(this),
    feature = {},
    items = [
        'nome',
        'civico',
        'istat',
        'cap',
        'comune'
    ],
    item;

for (var i = 0; i < items.length; i++) {
    item = items[i];
    feature[item] = $this.find(item).text();
}

extractedFeatures.push(feature);
});

$('#output').text(JSON.stringify(extractedFeatures));

and here you are my jsfiddle so you can try it

Any suggestion or workaround? Thank you very much in advance ...

Cesare

Upvotes: 1

Views: 2277

Answers (3)

Sidra
Sidra

Reputation: 113

In case if someone is facing issues parsing XML with namespaces in MS Edge browser, here is the workaround:

$.fn.filterNodeByPrefix = function(prefix) {
    return this.filter(function() {
        return this.prefix === prefix;
    });
};

We can use this function as:

$('gml\\:featureMember, featureMember', $xmlData).filterNodeByPrefix('gml');

Tried and tested in Chrome, FF, IE and MS Edge.

Upvotes: 0

ArturosPL
ArturosPL

Reputation: 1

This didn't worked for me, but I've found a working solution here:

http://jamesmcdonald.id.au/it-tips/google-chrome-xml-namespaces On above page we can find this:

$(xml).find('ns1\\:ld_det, ld_det');

Where 'ns1' is namespace such as gml, and 'ld_let' is node name.

And it works in Google Chrome too.

Upvotes: 0

A. Wheatman
A. Wheatman

Reputation: 6378

You have to be careful with namespaces... if you work with XML that has some namespaces declaration you have to keep it in mind and build appropriate selectors.

For example: 

$features = $('gml\\:featureMember, featureMember', $xmlData),

Please take a look on update fiddle. Now it works in FF and IE as well.

Upvotes: 4

Related Questions