Tag Archives: javascript table sorter

JavaScript Table Sort Library jDynamicSorter

jDynamicSorter is a new repository I have added to my GitHub account. The JavaScript library dynamically sorts Twitter Bootstrap row based tables simply using its custom HTML attributes.

What’s nice about this project?

  • Simple, easy to understand and commented source code
  • No unnecessary formatting of data using custom attributes. You simply specify what type of data is in each column and the library takes care of the rest.
  • The header sort UI is updated alongside the sorting process
  • Handles columns where each column div is wrapped in an HTML “A” link
  • Handles date sorting with any type of separator such as “/” or “-” and one or two digit days/months

Getting Started

To get started simply include jDynamicSorter.js, jDynamicSorter.css and the /img folder into your existing JQuery + Twitter Bootstrap project. You may want to apply other CSS attributes to your table as seen in the example project base.css. Next create a row based table with the required class, data-type and data-desc attributes as shown in the example jDynamicSorter-Example.html.

Possible Future Enhancements

  • Ability to have multiple tables on a single page
  • Handle additional date formats
  • Animations
  • Further simplify the code

View a live demo here.

Here is a screenshot:

jDynamicSorter screenshot