Solved

Table sorting with XML / HTML

Posted on 2013-06-21
8
234 Views
Last Modified: 2013-07-08
I'm still struggling with being able to work with XML and HTML.

I'm using the coding from: http://www.w3schools.com/xml/xml_to_html.asp

When I code it out and add in the proper path, element and sub elements I can only pull 3 rows max of all the items... The second I add in a 4th, 5th or 10th request to pull a sub element, the entire table breaks. I'm looked over the coding multiple times to insure my <td>, </td> are proper, but I'm still baffled...

Code working: http://tinyurl.com/l45z3mn

Code NOT working: http://tinyurl.com/mpme3es

Please feel free to crack open the html docs to see my code structure, the XML source, etc...

Any help would be appreciated!!! :-(

After this I'll then need to learn how to sort the menu, then stylize it!! Haha. Is there a program I can use to make this all easier???
0
Comment
Question by:MONSTERSTYLE
  • 4
  • 3
8 Comments
 
LVL 35

Expert Comment

by:Robert Schutt
ID: 39267733
The 'engine' node on the 3rd record is empty, you need to check for this. In general I would use a specific function for this:
document.write("<table border='1'>");
var x=xmlDoc.getElementsByTagName("vehicle");
for (i=0;i<x.length;i++)
  {
  document.write("<tr><td>");
  document.write(getNode0Text0(x[i], "carno"));
  document.write("</td><td>");
  document.write(getNode0Text0(x[i], "year"));
  document.write("</td><td>");
  document.write(getNode0Text0(x[i], "make"));
  document.write("</td><td>");
  document.write(getNode0Text0(x[i], "model"));
  document.write("</td><td>");
  document.write(getNode0Text0(x[i], "engine"));
  document.write("</td></tr>");
  }
document.write("</table>");

function getNode0Text0(oNode, sName)
  {
  var sReturnValue = "N/A"; // just a default value
  var oSubNodes = oNode.getElementsByTagName(sName);
  if (oSubNodes.length > 0)
    {
    var oChildNodes = oSubNodes[0].childNodes;
    if (oChildNodes.length > 0)
      {
      sReturnValue = oChildNodes[0].nodeValue;
      }
    }
  return sReturnValue;
  }

Open in new window

Note that this resembles your current output, if you wanted to use this in general, you should look at all subnodes instead of only the first.
0
 
LVL 35

Accepted Solution

by:
Robert Schutt earned 500 total points
ID: 39267736
More general things you ask for like style could be done more easily with xsl but that's a big step ahead. For starters I would say, look at CSS: you can add class attributes to your current html output and define the style in CSS. Sorting can be done in javascript before or after you put it in a table, I would say it depends on whether you want to do it once or let the user click on the table header for example. There are plenty scripts to be found for this on the net.
0
 

Author Comment

by:MONSTERSTYLE
ID: 39268359
robert, how would I go about modifying the subnode and getting this to function properly? :( I'm in a time crunch and the company who said they were providing this for us lied, so we're in a awkward position.
0
Master Your Team's Linux and Cloud Stack

Come see why top tech companies like Mailchimp and Media Temple use Linux Academy to build their employee training programs.

 
LVL 35

Expert Comment

by:Robert Schutt
ID: 39268366
I don't understand. With the code I posted you should be able to process the empty nodes and see the text "N/A", even if it doesn't exist altogether. Is that not working for you?
0
 

Author Comment

by:MONSTERSTYLE
ID: 39268504
Wow, the code worked flawlessly!! This morning when I read over your posts I assumed it was my code you were pasting in. I'm stoked!! Is there anyway I can hire you to finish the rest? Such as setting up sorting, allow the photos to appear, and a few other things? I've been stressing out about this for days and you obviously know what you're doing. I've added you on Facebook, can you accept and we can discuss more? I/my company can pay via Paypal.
0
 
LVL 35

Expert Comment

by:Robert Schutt
ID: 39268795
I don't need money for helping, just post some more info here unless it's sensitive?

The table already has some styling and like I said sorting shouldn't be a problem, for example using http://www.kryogenix.org/code/browser/sorttable/
0
 
LVL 82

Expert Comment

by:hielo
ID: 39280066
>>I'm in a time crunch
Post your info in your profile.
0
 

Author Closing Comment

by:MONSTERSTYLE
ID: 39309336
Robert went beyond EE to help me via Facebook. He showed extreme talent and understanding of writing code. We need more good people like him!!
0

Featured Post

MIM Survival Guide for Service Desk Managers

Major incidents can send mastered service desk processes into disorder. Systems and tools produce the data needed to resolve these incidents, but your challenge is getting that information to the right people fast. Check out the Survival Guide and begin bringing order to chaos.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

This article describes how to create custom column layout styles for Bootstrap. The article uses 5 columns to illustrate the concept, but the principle can be extended to any number of columns.
Finding original email is quite difficult due to their duplicates. From this article, you will come to know why multiple duplicates of same emails appear and how to delete duplicate emails from Outlook securely and instantly while vital emails remai…
In this tutorial viewers will learn how to embed videos in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: "<!DOCTYPE html>": Use the <video> tag to insert a video. Define the src as the URL of your video; this is similar to …
Video by: Mark
This lesson goes over how to construct ordered and unordered lists and how to create hyperlinks.

860 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question