jQuery XML Parsing/Traversing

jquery, parsing, traversal, xml, xml-parsing

Solution

I'm not clear what you're trying to loop over, I think one of the tags in your question was garbled. You say: "What I want to do is to loop each of the of a certain row." and I think you had a tag in there.

Anyway, here's some examples of extracting data from the parsed xml document using jQuery. The comments show what will be alerted.

I think part of the problem is you have the id values as siblings rather than children to the attributes. It seems like a more coherent structure might be:

<rows>
    <row id="5">
        <cell>Item1</cell>
        <attrs>
            <attr id="1">
                <type>CheckBox</type>
                <values>
                    <value>
                        <id>10</id>
                    </value>
                    <value>
                        <id>11</id>
                    </value>
                </values>
            </attr>
            <attr id="2">
                <type>CheckBox</type>
                <values>
                    <value>
                        <id>20</id>
                    </value>
                    <value>
                        <id>21</id>
                    </value>
                </values>
            </attr>
        </attrs>
    </row>
</rows>

But if you don't have control over the xml, please ignore that suggestion. :-)

Okay, here are some samples of traversal to get various pieces of data:

First let's just get "Item1"

<script type="text/javascript">
// Item1
$.get('sample.xml', null, function (data, textStatus) {
    alert( $(data).find('rows row[id=5] cell').text());
}, 'xml');
</script>

Now we'll get the 1 and the 2:

<script type="text/javascript">
// 1
// 2
$.get('sample.xml', null, function (data, textStatus) {
    $(data).find('rows row[id=5] attrs attr > id').each( function(){
            alert($(this).text()); // 1, 2
    });
}, 'xml');
</script>

And lastly, let's pull out the main attr ids and tie them into the values:

<script type="text/javascript">
// rows row[id=5] attrs attr > id 1 has inner ids of 10,11
// rows row[id=5] attrs attr > id 2 has inner ids of 20,21
$.get('sample.xml', null, function (data, textStatus) {

        var out = ''
        $(data).find('rows row[id=5] attrs attr > id').each( function(){
                out += 'rows row[id=5] attrs attr > id ' + $(this).text();
                var innerIds = [];
                $(this).siblings('values').find('value id').each(function(){
                    innerIds.push($(this).text())
                });
                out += ' has inner Ids of ' + innerIds.join(',') + '\n';
        });
        alert(out);
    }, 'xml');
</script>

Problem

I have the following XML- ``` <rows> <row id="5"> <cell>Item1</cell> <attrs> <attr> <id>1</id> <type>CheckBox</type> <values> <value> <id>10</id> </value> <value> <id>11</id> </value> </values> </attr> <attr> <id>2</id> <type>CheckBox</type> <values> <value> <id>20</id> </value> <value> <id>21</id> </value> </values> </attr> </attrs> </row> </rows> ``` What I want to do is to loop each of the of a certain row. I tried to do this in order to get all of the attr ids but I also got the values ids. ``` function fillForm(id){ var theRow = $(theXmlDoc).find('row[id='+id+']').get() $(theRow).find("attr").each(function(i) { alert($(this).find("id").text()); }); } ``` I also would like to note that main goal is loop each attr and afterwards to loop each value while I have the attr's id. P.S if you think of an easier/simpler way to do so with some other library I'm open for suggestions. Thanks in advance,

Original source