Query XML using Javascript

Question

I am trying to pull an xml node's value by referencing the value of another node.

Here is an snippet of one of my nodes

<document>
 <row>
  <DISTRICT>100</DISTRICT>
  <BIOS>BROWN</BIOS>
  <AREA_KM>3663.158164</AREA_KM>
  <AREA_MI>1414.347616</AREA_MI>
  <NAME>100</NAME>
  <REG>1</REG>
  <ACRES>905182</ACRES>
  <EMU_Name>Purcell</EMU_Name>
  <Shape_Leng>299746.4938</Shape_Leng>
  <Shape_Area>3663158164</Shape_Area>
  <LegalDesc>Northeast of District 151</LegalDesc>
 </row>
</document>

I'd like to fill in some HTML with value from the LegalDesc field based on the # in the DISTRICT field.

for example, I'd like to display the LegalDesc for DISTRICT==100. tempDist value comes from a form with a drop down

Something like this?

function dropDownAction(){
    var tempDist=document.HDForm.HuntingDistrict.value;
    var tempDesc=xmlDoc.getElementsByTagName("DISTRICT")[tempDist].getAttribute("LegalDesc");
    document.getElementById("field2").innerHTML=tempDesc;
}

thank in advance

is district unique (as in only one row has district 100)?

Tomas Reimers
– Tomas Reimers

2012-01-02 19:32:22 +00:00
Commented Jan 2, 2012 at 19:32 — Tomas Reimers
– Tomas Reimers, Commented Jan 2, 2012 at 19:32

Tomas Reimers · Accepted Answer · 2012-01-03 23:07:10Z

1

Personally, I would load all the rows into an array (using district as a key); then simply get the description from the array:

var xmlDoc = // load doc
var elementsToLoopThru=xmlDoc.getElementsByTagName("row");
var rowArray = new Array();

// go thru all the rows
for (var i = 0;i<elementsToLoopThru.length;i++){
    var district = "";
    var description = "No Description";
    var currRowChildren = elementsToLoopThru[i].childNodes;

    // go thru all the elements of a row and get the district and description
    for (var j = 0;j < currRowChildren.length; j++){
        if (currRowChildren[j].nodeName == "DISTRICT"){
            district = currRowChildren[j].childNodes[0].nodeValue;
        }
        else if (currRowChildren[j].nodeName == "LegalDesc"){
            description = currRowChildren[j].childNodes[0].nodeValue;
        }
    }

    // if district and description found, enter them as key value pair into array
    if (district != ""){
        rowArray[district] = description;
        alert(district + ": " + description); // DELETE ME
    }
}

Double check my code; I think it should work, but I am pretty rusty navigating XML

Then when you need to get value, simply access rowArray[NAME_OF_DISTRICT]

This should work if:

Districts are unique
and it DOESN'T MATTER IF DISTRICTS ARE ORDERED

here is jsfiddle: http://jsfiddle.net/RwE9s/15/

edited Jan 3, 2012 at 23:07

answered Jan 2, 2012 at 20:00

Tomas Reimers

3,2924 gold badges26 silver badges38 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

jotamon Over a year ago

After running the above code the rowArray remains with length 0 and never fills in. My xml is actually 162 in length. elementsToLoopThru is 162 in lenght while currRowChildren is only 23 in length. Here is my xml dl.dropbox.com/u/6029868/HdData.xml

Tomas Reimers Over a year ago

Fixed, I forgot that each node has a text node inside which holds the content

jotamon Over a year ago

I'll try this again. I am now thinking about going the way of JSON to hold my dataset.

Tomas Reimers Over a year ago

Then you are just parsing json, it will be even easier

Collectives™ on Stack Overflow

Query XML using Javascript

1 Answer 1

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related