Parsing data with jQuery

Question

<?xml version="1.0" encoding="utf-8"?>
<blamatrixrix>
<name></name>
<columns number="2">
 <column id="title" num="0">Title</column>
 <column id="content" num="1">Content</column>
</columns>
<rows number="7"></rows>
<b>Description</b>
<b>Description text here</b>
<b>Some title 1</b>
<b>Some text blabla for Some title 1</b>
<b>Some title 2</b>
<b>Some text blabla for Some title 2</b>
<b>Some title 3</b>
<b>Some text blabla for Some title 3</b>
<b>Some title 4</b>
<b>Some text blabla for Some title 4</b>
<b>Some title 5</b>
<b>Some text blabla for Some title 5</b>
<b>Some title 6</b>
<b>Some text blabla for Some title 6</b>
</blamatrixrix>

I would need to parse that data into table so that every other content would go into a own and every other in own .

Final would look like this:

<tr><td>Some title 1</td>  <td>Some title 2'</td> <td>Some title 3</td>  <td>Some title 4'</td></tr>
<tr><td>Some text 1</td><td>Some text 2</td><td>Some text 3</td><td>Some text 4</td></tr>

How should I start doing it? Thanks.

EDIT: I know the XML is not like it should but I cannot do nothing about it. I just need to parse it when its like that.

Answer 1

For starters, your XML is invalid:

<b>Description</c>

should be

<b>Description</b>

and

<bDescription text here</b>

should be

<b>Description text here</b>

Edit: you should also consider changing your XML structure to something more logical, like

<rows number="7">
    <row>
        <description>Description</description>
        <text>Description text here</text>
    </row>
    ...
</rows>

Edit #2: you can also just use jQuery to parse & traverse your XML, like so:

$(xml_string).children().each(function(c) {
    // do something
});

Or even better:

parseXMLValue($(xml_string).find('noniterablenode').text());
...
$(xml_string).find('iterablenode').each(function(e) {
    // do something with your iterable elements
});

etc, where parseXMLValue() would be your own function to use the value of a specific XML node.

Answer 2

Once the errors are fixed you could do something like the following:

$.ajax( 
  url: "path/to/file.xml", 
  type: "GET", 
  dataType:"xml", 
  success: function(xml){ 
    var cols = [];

    $(xml).find("col").each(function(){
      cols.push({
        id:$(this).attr('id'),
        text:$(this).text()
      });
    });

    $(xml).find("row").each(function(){
      var info = "<tr>";

      for(var i = 0; i < cols.length; i++) {
        info += "<td>" + $(this).find(cols[i].id).text() + "</td>";
      }

      info += "</tr>";

      $("#table").append(info);
    });
  },
  error : function(){ //some code}
});

This would work with the following XML document.

<?xml version="1.0" encoding="utf-8"?>
<tableinfo>
  <columns>
    <col id="title">Title</column>
    <col id="content">Content</column>
  </columns>
  <rows>
    <row>
      <title>test</title>
      <content>text content</content>
    </row>
    <row>
      <title>test2</title>
      <content>more text content</content>
    </row>
  </rows>
</tableinfo>