I am using jquery to get xml data into html (table). ( classical Javascript coding only work if you are doint it through a webserver but I am currently not interested in to work on a webserver.
The call function to read my xml data works fine(in Firefox only ) I would like alos to make use of the tablesorter jquery plugin. Unfortunatly, when I use it it doesn't work...Any clue on what could be wrong with code ? Is it perhaps I am using tablesorter in the wrong place..? Any alternative of proceeding is welcome (bear in mind that I am not working on a webserver).
here is the link of tablesorter plugin: home page tablesorter
the data called sites:
<?xml version="1.0" encoding="ISO-8859-1" ?>
<root>
<snapshot>
<order>1</order>
<screen>1</screen>
<randomised>0</randomised>
</snapshot>
<snapshot>
<order>2</order>
<screen>2</screen>
<randomised>1</randomised>
</snapshot>
</root>
the code has two calls one for calling tablesorter plugin and one to read xml data using jquery
<!DOCTYPE html>
<html>
<head>
<style>
table, th, td {
border: 1px solid black;
border-collapse:collapse;
}
th, td {
padding: 5px;
}
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"type="tex/javascript"></script>
<script src="js/jquery.tablesorter.js" type="text/javascript"></script>
<script type="text/javascript" src="js/jquery-latest.js"></script>
<script>
//initialise my html table below for get ready to do sorting by calling tablesorter plugin
$(document).ready(function()
{
$("#metrics").tablesorter();
}
);
//import xml data into html
$(document).ready(function(){
$.ajax({
type: "GET",
url: "sites.xml",
dataType: "xml",
success: function(xml) {
$(xml).find('snapshot').each(function(){
var Cl0 = $(this).find("order").text();
var Cl1 = $(this).find("screen").text();
var Cl2 = $(this).find("randomised").text();
$('<tr></tr>').html('<td>'+Cl0+'</td><td>'+Cl1+'</td><td>'+Cl2+'</td>').appendTo('#metrics');
});
}
});
});
</script>
</head>
<body>
<p>This is my table.</p>
<table id="metrics" class="tablesorter" >
<tr><th>Order</th><th>screen</th><th>randomised</th></tr>
</table>
</body>
</html>
Cheers
saskap