Issue with jQuery tablesorter
hey guys,
I am using jQuery tablesorter plugin and it seems to be working fine. But i have a requirement to filter the data's based on client and do sorting then. I put a combo box and from that user will select the Client. Based on the selected client, i manipulate the JSON data locally and display the relevant data's based on client ID. Before selecting a client, say All Client (means all data from JSON), sorting is working fine. But after selecting a client, the sorting is working only ascending and not vice versa. I don't know where i went wrong. Please help me guys.
With the below javascript code, i display the values for all clients and particular clients.
- function addData()
- {
- var table = document.getElementById('example1');
- var tablerows = parseInt(document.getElementById('example1').rows.length);
- while(table.lastChild){
- table.removeChild(table.lastChild);
- }
- // For flight
- if (serviceDetails1.length > 0) {
- var serviceDetails = new Array();
- var e = document.getElementById("clientid");
- var clientid = e.options[e.selectedIndex].value;
- if (parseInt(clientid) == 0)
- serviceDetails = serviceDetails1;
- else {
- serviceDetails = new Array();
- for ( var i = 0; i < serviceDetails1.length; i++) {
- if (parseInt(serviceDetails1[i].client_id) == parseInt(clientid))
- {
- serviceDetails.push(serviceDetails1[i]);
- }
- }
- }
-
- var outstanding = 0;
-
- for ( var i = 0; i < serviceDetails.length; i++) {
-
- var tr = document.createElement("tr");
- tr.align = 'center';
- var URL = '';
- var tempVal = '';
- var traveller_name = '';
-
- var tDate = new Date(serviceDetails[i].invoice_date);
-
- outstanding += parseFloat(amountTot);
-
- var td1 = document.createElement("td");
- td1.className = 'maintext';
- td1.innerHTML = '<input type="checkbox" value="' + tempVal + '" name="invoices" onchange="javascript:calculateTotal(this)"/>';
- var td2 = document.createElement("td");
- td2.className = 'maintext';
- td2.innerHTML = '<a href="javascript:openWindow(\'' + URL
- + '\');">' + serviceDetails[i].invoice_no + '</a>';
- var td6 = document.createElement("td");
- td6.className = 'maintext';
- //td6.innerHTML = '<a href="javascript:openWindow(\'' + URL
- // + '\');">' + dat_obj.date+' / '+(month+1) +' / '+year.substr(1,2)+ '</a>';
- td6.innerHTML = '<a href="javascript:openWindow(\'' + URL
- + '\');">' +serviceDetails[i].invoice_date+ '</a>';
- var td3 = document.createElement("td");
- td3.className = 'maintext';
- td3.innerHTML = '<a href="javascript:openWindow(\'' + URL
- + '\');">' + traveller_name + '</a>';
- var td4 = document.createElement("td");
- td4.className = 'maintext';
- td4.innerHTML = '<a href="javascript:openWindow(\'' + URL
- + '\');">' + serviceDetails[i].project_name + '</a>';
- var td5 = document.createElement("td");
- td5.className = 'maintext';
- td5.innerHTML = '<a href="javascript:openWindow(\'' + URL
- + '\');">' + serviceDetails[i].total_fare.toFixed(2) + '</a>';
- tr.appendChild(td1);
- tr.appendChild(td2);
- tr.appendChild(td6);
- tr.appendChild(td3);
- tr.appendChild(td4);
- tr.appendChild(td5);
- table.appendChild(tr);
- document.getElementById('outstanding_amount').innerHTML = outstanding.toFixed(2);
- }
-
- $.tablesorter.addParser({
- id: 'quarters',
- is: function (s) {
- return false;
- },
- format: function (s) {
- s = s.toLowerCase().replace(/q[0-9]/,'').replace(/\(/,'').replace(/\)/,'');
- match = s.match(/(0[1-9]|[12][0-9]|3[01])[- /.](0[1-9]|1[012])[- /.](19|20\d\d)/);
- return match[3] + match[2] + match[1];
- },
- type: 'text'
- });
-
- $("#example").tablesorter({headers: {2: {sorter: 'quarters'}}, sortList: [[1,0], [1,1], [2,0], [2,1], [5,0], [5,1]]})
- .tablesorterPager({container: $("#pager")});
- } else {
- var tr = document.createElement("tr");
- var td1 = document.createElement("td");
- td1.colSpan = 5;
- td1.align = 'center';
- td1.innerHTML = 'No invoice(s) found for Flight';
- tr.appendChild(td1);
- table.insertBefore(tr, document.getElementById("display_last"));
- }
- }
The highlighted code is for tablesorter. I am calling this method @ page load once and after whenever a user selects a client.