New to JQuery, issue with tablesorter

Hello all. I am new to using jquery and I am having an issue getting tablesorter to work on a table that I generated using Tableizer.

Any help would be wonderful. It could honestly be a naming or structure issue, or a combination of everything but I am at a severe loss on how to navigate this. I am more a designer than coder. I'm sure it is full of errors but any help you can offer would really be greatly appreciated and needed.

I've posted the entire code and have hosted the page in question: here temporarily.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>davide marchetti architetto</title>
<script type="text/javascript" src="/path/to/jquery-latest.js"></script>
<script type="text/javascript" src="/path/to/jquery.tablesorter.js">
$(document).ready(function()
{
$("#myTable").tablesorter();
}
);
</script>
<style type="text/css">
<!--
body {
font: 100%/1.4 Verdana, Arial, Helvetica, sans-serif;
background-color: #FFFFFF;
margin: 0;
padding: 0;
color: #000;
background-image: url();
background-repeat: no-repeat;
}
/* ~~ Element/tag selectors ~~ */
ul, ol, dl { /* Due to variations between browsers, it's best practices to zero padding and margin on lists. For consistency, you can either specify the amounts you want here, or on the list items (LI, DT, DD) they contain. Remember that what you do here will cascade to the .nav list unless you write a more specific selector. */
padding: 0;
margin: 0;
}
h1, h2, h3, h4, h5, h6, p {
margin-top: 0; /* removing the top margin gets around an issue where margins can escape from their containing div. The remaining bottom margin will hold it away from any elements that follow. */
padding-right: 15px;
padding-left: 15px; /* adding the padding to the sides of the elements within the divs, instead of the divs themselves, gets rid of any box model math. A nested div with side padding can also be used as an alternate method. */
}
a img { /* this selector removes the default blue border displayed in some browsers around an image when it is surrounded by a link */
border: none;
}
/* ~~ Styling for your site's links must remain in this order - including the group of selectors that create the hover effect. ~~ */
a:link {
color:#414958;
text-decoration: underline; /* unless you style your links to look extremely unique, it's best to provide underlines for quick visual identification */
}
a:visited {
color: #4E5869;
text-decoration: underline;
}
a:hover, a:active, a:focus { /* this group of selectors will give a keyboard navigator the same hover experience as the person using a mouse. */
text-decoration: none;
}
/* ~~ this container surrounds all other divs giving them their percentage-based width ~~ */
.container {
width: 80%;
max-width: 1260px;/* a max-width may be desirable to keep this layout from getting too wide on a large monitor. This keeps line length more readable. IE6 does not respect this declaration. */
min-width: 780px;
margin: 0 auto; /* the auto value on the sides, coupled with the width, centers the layout. It is not needed if you set the .container's width to 100%. */
}
/* ~~ This is the layout information. ~~
1) Padding is only placed on the top and/or bottom of the div. The elements within this div have padding on their sides. This saves you from any "box model math". Keep in mind, if you add any side padding or border to the div itself, it will be added to the width you define to create the *total* width. You may also choose to remove the padding on the element in the div and place a second div within it with no width and the padding necessary for your design.
*/
.content {
padding: 10px 0;
font-size: x-small;
}
/* ~~ This grouped selector gives the lists in the .content area space ~~ */
.content ul, .content ol {
padding: 0 15px 15px 40px; /* this padding mirrors the right padding in the headings and paragraph rule above. Padding was placed on the bottom for space between other elements on the lists and on the left to create the indention. These may be adjusted as you wish. */
}
/* ~~ miscellaneous float/clear classes ~~ */
.fltrt { /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
float: right;
margin-left: 8px;
}
.fltlft { /* this class can be used to float an element left in your page. The floated element must precede the element it should be next to on the page. */
float: left;
margin-right: 8px;
}
.clearfloat { /* this class can be placed on a <br /> or empty div as the final element following the last floated div (within the #container) if the overflow:hidden on the .container is removed */
clear:both;
height:0;
font-size: 1px;
line-height: 0px;
}
body,td,th {
font-family: "Courier New", Courier, monospace;
font-size: x-small;
}
#apDiv1 {
position: absolute;
width: 618px;
height: 268px;
z-index: 1;
left: 186px;
top: 147px;
overflow: hidden;
}
#apDiv2 {
position: absolute;
width: 698px;
height: 299px;
z-index: 1;
left: 171px;
top: 128px;
overflow: scroll;
}
<style type="text/css">
table.tableizer-table {
border: 1px solid #CCC; font-family: Courier New, Courier, monospace;
font-size: 12px;
}
.tableizer-table td {
padding: 4px;
margin: 3px;
border: 1px solid #ccc;
}
.tableizer-table th {
background-color: #000000;
color: #FFF;
font-weight: bold;
}
</style>
<style type="text/css">
#apDiv4 {
position: realtive;
width: 697px;
height: 299px;
z-index: 1;
left: -141px;
top: -636px;
overflow: scroll;
}
#apDiv3 {
position: relative;
width: 700px;
height: 300px;
z-index: 2;
}
h1,h2,h3,h4,h5,h6 {
font-family: "Courier New", Courier, monospace;
}
</style>
</head>
<div class="container">
<div class="content"><img src="images/Davide.png" width="800" height="600" usemap="#Map" border="0" />
<div id="apDiv2">
<map name="Map" id="Map">
<area shape="rect" coords="48,416,125,435" href="news.html" />
<area shape="rect" coords="262,416,300,434" href="studio.html" />
<area shape="rect" coords="490,416,545,435" href="projects.html" />
<area shape="rect" coords="702,415,751,436" href="contact.html" />
</map>
<table class="tableizer-table">
<tr class="tableizer-firstrow"><th>YEAR </th><th>PROJECT</th><th>LOCATION</th><th>CATEGORY</th><th>STATUS</th></tr>
<tr><td>2013</td><td>EXPO 2015 - Italian Pavilion</td><td>Milan - Italy</td><td>Culture</td><td>Competition</td></tr>
<tr><td>2012</td><td>Requalification of "Almerici", "Bufalini" and "Fabbri" Squares</td><td>Cesena - Italy</td><td>Urban planning</td><td>Competition</td></tr>
<tr><td> </td><td>Re-thinking Shanghai: sustainable intervention along the Suzhou Creek</td><td>Shanghai - China</td><td>Mixed use</td><td>Competition</td></tr>
<tr><td> </td><td>VCC Flat</td><td>Rome - Italy</td><td>Interior design</td><td>Commission / Built</td></tr>
<tr><td>2011</td><td>London 2012 Olympic Games Information Pavilion</td><td>London - UK</td><td>Culture</td><td>Competition</td></tr>
<tr><td> </td><td>Enhancement project for the sacred area of the sanctuary of Hercules Victor</td><td>Tivoli - Italy</td><td>Culture</td><td>Competition</td></tr>
<tr><td>2010</td><td>VTL Flat </td><td>Rome - Italy</td><td>Interior design</td><td>Commission / Built</td></tr>
<tr><td> </td><td>BNC Flat</td><td>Rome - Italy</td><td>Interior design</td><td>Commission / Built</td></tr>
<tr><td> </td><td>Expansion of the "Farnesina" High School</td><td>Rome - Italy</td><td>Education</td><td>Competition / Selected Project</td></tr>
<tr><td> </td><td>Neanderthal Art Center</td><td>Piloña - Spain</td><td>Culture</td><td>Competition</td></tr>
<tr><td> </td><td>New pedestrian & cycling footpath in the site of the "San Leopoldo II" old bridge</td><td>Poggio a Caiano - Italy</td><td>Infrastructure</td><td>Competition</td></tr>
<tr><td> </td><td>Proposition 2065 - St. Leonards site</td><td>Sidney - Australia</td><td>Mixed use</td><td>Competition</td></tr>
<tr><td> </td><td>MEIS - National Museum of Italian Judaism and Shoah </td><td>Ferrara - Italy</td><td>Culture</td><td>Competition / 3rd Prize</td></tr>
<tr><td> </td><td>36 The Calls Design Competition</td><td>Leeds - UK</td><td>Offices</td><td>Competition</td></tr>
<tr><td> </td><td>Europan 10: masterplan for an harbour area</td><td>Rudkøbing - Denmark</td><td>Urban planning</td><td>Competition</td></tr>
<tr><td>2009</td><td>"Scuola in Piazza a Levante" - Kindergarten and public areas</td><td>Bisceglie - Italy</td><td>Education</td><td>Competition</td></tr>
<tr><td> </td><td>CIBAF - City of Kids </td><td>Frattamaggiore - Italy</td><td>Education</td><td>Competition</td></tr>
<tr><td> </td><td>Designing in Teheran</td><td>Teheran - Iran</td><td>Mixed use</td><td>Competition / Selected Project</td></tr>
<tr><td>2008</td><td>DawnTown 2008: Waterworks</td><td>Miami - USA</td><td>Mixed use</td><td>Competition</td></tr>
<tr><td> </td><td>Venice Biennale New Australian Pavillion</td><td>Venice - Italy</td><td>Culture</td><td>Competition / 1st Prize</td></tr>
<tr><td> </td><td>New pedestrian and cycling bridge</td><td>Civita di Bagnoregio - Italy</td><td>Infrastructure</td><td>Competition</td></tr>
<tr><td> </td><td>Renovation of "San Ciro" Square</td><td>Portici - Italy</td><td>Urban planning</td><td>Competition / 2nd phase selected / 3rd Prize</td></tr>
<tr><td> </td><td>Renovation of "Umberto I°" Square</td><td>San Ferdinando di Puglia - Italy</td><td>Urban planning</td><td>Competition</td></tr>
<tr><td> </td><td>Historic Renovation of the "Corsie Sistine" Hospital Wards </td><td>Rome - Italy</td><td>Culture</td><td>Tender Competition (design/bid/build)</td></tr>
<tr><td> </td><td>Cupboard</td><td>Rome - Italy</td><td>Furniture design</td><td>Commission / Built</td></tr>
<tr><td> </td><td>Office table and lighting system</td><td>Rome - Italy</td><td>Furniture design</td><td>Commission / Built</td></tr>
<tr><td> </td><td>New City Library</td><td>Legnano - Italy</td><td>Library</td><td>Competition</td></tr>
<tr><td> </td><td>Office table</td><td>Rome - Italy</td><td>Furniture design</td><td>Concept Design</td></tr>
<tr><td> </td><td>Volleyball Arena, Hotel and Commercial Spaces</td><td>Rome - Italy</td><td>Mixed use</td><td>Concept Design</td></tr>
<tr><td>2007</td><td>New Provincial Archaeological Museum in the Santa Scolastica Monastery</td><td>Bari - Italy</td><td>Culture</td><td>Competition / 5th Prize</td></tr>
<tr><td> </td><td>The City of Water and Health</td><td>Rome - Italy</td><td>Mixed use</td><td>Competition</td></tr>
<tr><td> </td><td>Parkway Iconic Bridge</td><td>Sheffield - UK</td><td>Infrastructure</td><td>Competition</td></tr>
<tr><td> </td><td>Renovation of "Loveno 84" Sport Center</td><td>Menaggio - Italy</td><td>Sport</td><td>Competition</td></tr>
<tr><td> </td><td>"Guardia di Finanza" Corp Main Headquarters</td><td>Catanzaro - Italy</td><td>Mixed use</td><td>Competition</td></tr>
<tr><td> </td><td>"Lega Lombarda" Real Estate Complex Urban Development</td><td>Rome - Italy</td><td>Mixed use</td><td>Tender Competition (design/bid/build) </td></tr>
<tr><td> </td><td>Necklace</td><td>Rome - Italy</td><td>Jewellery design</td><td>Prototype </td></tr>
<tr><td> </td><td>Moon putter</td><td>Rome - Italy</td><td>Product design</td><td>Prototype</td></tr>
<tr><td> </td><td>Aleale Coffee Table</td><td>Rome - Italy</td><td>Furniture design</td><td>Concept Design</td></tr>
<tr><td>2006</td><td>"1st October" Public Square</td><td>Santa Maria Capua Vetere - Italy</td><td>Urban planning</td><td>Competition / 1st Prize / Built</td></tr>
<tr><td> </td><td>"Attilio Pecile" New Square and Sustainable Mixed Use Building</td><td>Rome - Italy</td><td>Mixed use</td><td>Competition / 1st Prize</td></tr>
<tr><td> </td><td>Renewal of the "Porta Nuova" Old Tower</td><td>Venice - Italy</td><td>Culture</td><td>Competition / 2nd Prize</td></tr>
<tr><td> </td><td>"Meno e più 4": Civic Center and Pre-school Building</td><td>Rome - Italy</td><td>Mixed use</td><td>Competition / Mention</td></tr>
<tr><td> </td><td>Urban Renewal of Historic Building and Public Squares</td><td>Conversano - Italy</td><td>Urban planning</td><td>Competition / 2nd Prize</td></tr>
<tr><td> </td><td>New Seafront and Beach Accesses</td><td>Fregene - Italy</td><td>Urban planning</td><td>Competition / Mention</td></tr>
<tr><td> </td><td>Requalification of Main Streets and Squares of the Old City Centre</td><td>Bari - Italy</td><td>Urban planning</td><td>Competition</td></tr>
<tr><td> </td><td>Gyeonggi-do Jeongok Prehistory Museum</td><td>Jeongok-ri - South Korea</td><td>Culture</td><td>Competition / Honourable Mention</td></tr>
<tr><td> </td><td>Low-income housing development</td><td>Guadalajara/Ceuta - Spain</td><td>Residential</td><td>Competition</td></tr>
<tr><td> </td><td>Shop extension</td><td>Rome - Italy</td><td>Retail</td><td>Commission / Concept Design</td></tr>
<tr><td> </td><td>Temporary Concert Hall</td><td>Rome - Italy</td><td>Culture</td><td>Concept Design</td></tr>
<tr><td> </td><td>Office Space Interior Design - New Seat of the Lombardy Regional Government </td><td>Milan - Italy</td><td>Office</td><td>Tender Competition (design/bid/build)</td></tr>
<tr><td>2005</td><td>Europan 8 - Urban Requalification</td><td>Istanbul - Turkey</td><td>Urban planning</td><td>Competition</td></tr>
<tr><td> </td><td>Natural Park Visitor Center, Kindergarten and Primary School</td><td>Funes - Italy</td><td>Education</td><td>Competition</td></tr>
<tr><td> </td><td>Coastal Area Development</td><td>Latina - Italy</td><td>Urban planning</td><td>Competition</td></tr>
<tr><td> </td><td>Requalification of Three Squares</td><td>Benevento - Italy</td><td>Urban planning</td><td>Competition</td></tr>
<tr><td> </td><td>Office and Data Center New Building in the Ministry of Defense headquarters</td><td>Rome - Italy</td><td>Office</td><td>Concept Design</td></tr>
<tr><td>2004</td><td>JCD Floating Pearl Store</td><td>Tokio - Japan</td><td>Retail</td><td>Competition / 2nd phase selected </td></tr>
<tr><td> </td><td>Requalifications of Rome’s Beachfront and Coastal Areas</td><td>Ostia - Italy</td><td>Urban planning</td><td>Competition / 1st Prize</td></tr>
<tr><td> </td><td>40 Apartments Building and Sport Center</td><td>Rome - Italy</td><td>Mixed use</td><td>Competition / 2nd Prize</td></tr>
<tr><td> </td><td>nMBA New Beaux-Art Museum</td><td>Lausanne - Switzerland</td><td>Culture</td><td>Competition</td></tr>
<tr><td> </td><td>The Dubai Residence and Hotel Towers</td><td>Dubai - UAE</td><td>Mixed use</td><td>Concept Design</td></tr>
<tr><td> </td><td>Shoes and Accessories Shop</td><td>Rome - Italy</td><td>Retail</td><td>Commission / Concept Design</td></tr>
<tr><td>2003</td><td>Pedestrian and cycling Bridge </td><td>Rome - Italy</td><td>Infrastructure</td><td>Competition</td></tr>
<tr><td> </td><td>Temporary Pavillion for a Car Show</td><td>Rome - Italy</td><td>Retail</td><td>Commission / Concept Design</td></tr>
<tr><td> </td><td>Belvedere Tower</td><td>Castellammare di Stabia - Italy</td><td>Infrastructure</td><td>Concept Design</td></tr></table>
</div>
</div>
</div>
</body>
</html>

Topic Participants
erinapellegrino
saikrishna.sesha

New to JQuery, issue with tablesorter

New to JQuery, issue with tablesorter

Topic Participants

erinapellegrino

saikrishna.sesha