How To Parse XML Files Using JQuery To Update A HTML Table

Question

I need to parse XML files that will be a certain format and then work out whether the home or away team has won and then allocate 3 or 1 points to a HTML table (Overall Points Column) determined by the result, I would prefer to use JQuery to do this.

results.xml Code:

<?xml version="1.0"?>
<title>Results</title>
  <results>
    <result id="1234">
      <hometeam>
        <name>Roma</name>
        <score>2</score>
      </hometeam>
      <awayteam>
        <name>Lazio</name>
        <score>0</score>
      </awayteam>
  </result>
</results>

HTML Code:

<table id="table">
<th>Team</th>
<th>Played</th>
<th>Won</th>
<th>Drawn</th>
<th>Lost</th>
<th>Total Goals</th>
<th>Overall Points</th>

<tr>
<td>Roma</td>
<td>0</td>
<td>0</td>
<td>0</td>
<td>0</td>
<td>0</td>
<td>0</td>
</tr>
<tr>
<td>Lazio</td>
<td>0</td>
<td>0</td>
<td>0</td>
<td>0</td>
<td>0</td>
<td>0</td>
</tr>
<tr>
<td>Inter</td>
<td>0</td>
<td>0</td>
<td>0</td>
<td>0</td>
<td>0</td>
<td>0</td>
</tr>
<tr>
<td>Milan</td>
<td>0</td>
<td>0</td>
<td>0</td>
<td>0</td>
<td>0</td>
<td>0</td>
</tr>
</table>

JQuery Code:

function showData() {
$.ajax({
type: "GET",
url: "results.xml",
dataType: "xml",

This is all I have so far for the JQuery code.

Where would the calculation to work out the result go?

if (hometeam score > awayteam score)
{ add 3 to hometeams Overall Points}
else if (hometeam score = awayteam score)
{ add 1 to hometeams Overall Points and add 1 to awayteams Overall Points}
else 
{ add 3 to awayteams Overall Points}

How would I evaluate the hometeam and awayteam score and update the correct team in the HTML table?

Thank you for your help.

Community · Accepted Answer · 2017-05-23 12:11:23Z

0

Sure, you could use javascript to parse xml such as with jQuery's parseXML function. http://api.jquery.com/jQuery.parseXML/

However, this could be slow because you must parse a large file every time an end-user goes to your page. XML files tend to be hefty.

I would instead convert the XML to either JSON or database rows first.

PHP has a library called Simple XML Parser that comes with most distributions. The interface is really straightforward. Python also has a rich library called lxml to parse XML.

Of course, if you really want to parse XML with javascript, this question is helpful I think. Paging Through XML Data Using jQuery and HTML

edited May 23, 2017 at 12:11

CommunityBot

11 silver badge

answered Feb 13, 2012 at 20:47

dangerChihuahua007

21.1k39 gold badges131 silver badges212 bronze badges

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

Comments

bjelli · Accepted Answer · 2012-02-13 21:15:51Z

When you compare your ajax call

$.ajax({
type: "GET",
url: "results.xml",
dataType: "xml",

to the example in the jquery documentation you see what's missing. Here is what your call could look like:

$.ajax({
  url: "results.xml",
  dataType: "xml",
  type: "GET",
  success: function(data){
    // do something with data
  }
});

you need to specify a function that will be called if the data is successfully returned. In the example above the function is an anonymous function. you could also use a normal function with a name:

function handle_success(data){
    // do something with data
}

$.ajax({
  url: "results.xml",
  dataType: "xml",
  type: "GET",
  success: handle_success
});

But beware the A in AJAX: it stands for asynchronous. which means: your success-function will be called a lot later, or even never. the rest of your program continues on as usual after the ajax-call.

Collectives™ on Stack Overflow

How To Parse XML Files Using JQuery To Update A HTML Table

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related