The problem is that when adding or replacing old content with new one, the old one is sorted anyway. How can this be fixed?

function adTable() { var tbody = $('#mytable tbody'); for (i = 0, j = 1; i < tab_friends.length; i++, j++) {//Заполнение таблицы tbody.append('<tr><td>' + nodes[j].first_name + '</td><td>' + nodes[j].last_name + '</td><td>' + tab_friends[i].friends.length + '</td></tr>'); } jQuery(document).ready(function($) {//Сортировка $("#mytable").tablesorter({}); }); }
  • I hope you understand that according to the presented piece it is impossible to determine the root of the problem? - Alexey Shimansky
  • @ Alexey Shimansky Added full code - Sonfire
  • And what about tab_friends and nodes? - br3t
  • @ br3t Text Records - Sonfire

1 answer 1

If I understand the problem correctly, then your sorting .tablesorter due to the .tablesorter being called .tablesorter . If tablesorter has already been called for a table, then when updating data it is enough to call update . Here is an example in which the isUpdate variable isUpdate responsible for initializing or updating tablesorter. The genNewData function has genNewData added to generate demo data, in your case it is not needed.

 $(document).ready(function() { var tab_friends = []; var nodes = []; var isUpdate = false; function adTable() { var table = $("#mytable"); var tbody = table.find('tbody'); for (i = 0, j = 1; i < tab_friends.length; i++, j++) { tbody.append('<tr><td>' + nodes[j].first_name + '</td><td>' + nodes[j].last_name + '</td><td>' + tab_friends[i].friends.length + '</td></tr>'); } if (isUpdate) { table.trigger('update'); } else { table.tablesorter({}); } isUpdate = true; } $('button').click(genNewData); function genNewData() { var str = 'qwertyuiopasdfghjklzxcvbnm'; nodes = []; for (var i = 0; i < 4; i++) { nodes.push({ first_name: str.split('').sort(function(a,b) { Math.random() * 2 - 1}).join('').substr(0, 6), last_name: str.split('').sort(function(a,b) { Math.random() * 2 - 1}).join('').substr(0, 8) }); } tab_friends = []; for (var j = 0; j < 3; j++) { tab_friends.push({ friends: { length: Math.floor(100 * Math.random()) } }) } adTable(); } }); 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.tablesorter/2.28.9/js/jquery.tablesorter.min.js"></script> <table id="mytable" rules="all" border="1"> <thead> <tr> <th>First name</th> <th>Last name</th> <th>Friends</th> </tr> </thead> <tbody></tbody> </table> <button>Add new data</button>

If you sort by any column, the sorting will be saved after adding the data.

  • Thank! This is what I need - Sonfire