quick manipulations with table rows

Question

JavaScript

There is a table on 5 lines. And the need to hide / show selections from 1k of its lines. The usual $(#table .need_hide).hide() takes a very long time. Minutes depending on the browser. Is there any way to do this using js or transfer it to the server only?

Answer 1

This trick helps a lot: to prescribe a class to only one, the parent element and set visibility in css:
<style>
#sometable.do_hide .need_hide { display: none; }
</style>
...
$('#sometable').addClass('do_hide');


Answer 2

If you need it in JS, the fastest way is to abandon abstractions.

  var trs  = document.getElementById("table").getElementsByTagName("tr");
  for (var i=0; i<trs.length;i++){
    var tr = trs[i];
    if (tr.hasAttribute("class") && tr.getAttribute("class") == "need_hide"){
       tr.setAttribute("style", "display: none");
    }
  }

Answer 3

Are you sure you really need 5 thousand rows of data on one page? I would paginate data on the server side into pages of 50 rows, for example. And to search for the necessary data - sorting by various columns + filtering operation + Hide button.

Answer 4

Try hiding the table (optionally with display:none, better with visibility:hidden), then hide all rows, and then show the table again.
I advise you to read: webo.in/articles/all/2009/31-rending-restyle-reflow-relayout/

Answer 5

You can’t transfer this to the server either, a 5K static grid will take a very long time to load, I suggest you try not to use table in principle, but switch to ul li, browsers work with lists much faster, even IE7, I really tried it for thousands of records, grid on js filled in for a very long time, not to mention IE which hung the whole Windows. But with the lists, everything looked much more fun! plus advice fromand I think it will be faster ... make the line inside the li element inline elements, for example span they are faster than div

Answer 6

Create 5 tables of 1k and hide the tables themselves.

Answer 7

there is a plugin for jquery www.trirand.com/blog/jqgrid/jqgrid.html (Advanced -> Search Big Sets) just for working with large tables

Answer 8

The client is not designed to handle this amount of information.
If someone's computer is not as powerful as yours, or a couple more weight applications are launched along the way, the speed will be even lower.
You can try to work with the uploaded data in JSON, and not with a table, and generate the table itself on the go and insert it in the right place - it will be even faster.