Creating Static HTML Files with Sortable and Filterable Tables

ajaxcsshtmljavascript

I want to create a static HTML file I can email to someone with a lot of data, and have that data sortable and filterable. What is the easiest to use library or package I can use to get this off the ground?

Best Answer

You can't. You need one of three things to change HTML structure semantically

  • JavaScript, event handlers and dom manipulation
  • Forms, servers and postbacks to change the page and send a new one
  • CSS hackery, things like remodelling the CSS based on the :active state or manipulate checkboxes :checked state.

In theory it's possible to implement this with HTML and CSS alone but that's going to a be a nightmare.

Why don't you just add a link to a google document with a sortable table in it, in your email.

Of course using JavaScript to implement a sortable table isn't hard.

table.addEventListener("click", function (ev) {
  if (ev.target.tagName === "th") {
    sortTable(ev.target);
  }
});

form.addEventListener("change", function (ev) {
  applyFilters(ev);
});

Just implement sortTable and applyFilters

Related Topic