Using Javascript to sort table properly?

Question

I've been working on this website on my computer for the past several weeks, but have had it a point that I just can't figure something out with my table sorting. The site itself runs off PHP but I've duplicated the HTML output to make it easier for you guys to help me diagnose what the problem is.

Here's a link to the Working Page : http://privateservercloud.com/working.htm

Here's a link to the Not Working Page : http://privateservercloud.com/not-working.htm

If you go to the Working Page, you'll see that you can click on any of the headers of the table and it will sort them. However, if you go to the Not Working Page, you'll see that this doesn't happen.

I'm trying to figure out what's missing or coded incorrectly and causing this to happen. I've uploaded all of the HTML, CSS, and Javascript that's running this part of the site so you can see how it's all working and hopefully that'll make life a bit easier for anyone that can help.

So... does anyone see what I'm doing wrong or know what needs to be fixed?

Answer 1

I load the not-working example in Firefox with Firebug and get the following:

TypeError: document.getElementById(...) is null ...for(var e=0;e<menuids.length;e++){var t=document.getElementById(menuids[e]).getE...

in dropdown.js line 1.

The debugging tools really are your friends. If you don't want to use Firefox, you can do the same thing with the development tools in Chrome.

I find errors when I run rhe validator at http://validator.w3.org and a pile of CSS errors at http://jigsaw.w3.org/css-validator/

When things don't work right, validate the HTML, which at least mostly assures you have a valid DOM. Then validate the CSS and use the JavaScript console in your favorite browser's debugger.