:::: MENU ::::

How to sort HTML table rows using different jQuery plugins?

jquery_logo

There are many jQuery plugin available to deal with table. They provides capability of sorting, paginating, filtering tabular data.

Popular jQuery table sorting plugins:-

  1. Data Tables▼ jump to implementation
  2. Table sorter▼ jump to implementation
  3. Stupid Table▼ jump to implementation

Let’s take sample – order receipt tabular data for demo to implement it using above plugins.

[1] Table sorting using jQuery datatables.js plugin

Initialization of plugin with cdn scripts and css

Sorting table with DataTable() method

 jQuery datatable() plugin demo

Grab code using view source

[2] Table sorting using jQuery tablesorter.js plugin

Initialization of plugin with cdn scripts and css

Sorting table with tablesorter() method

 jQuery tablesorter() plugin demo


Grab code using view source

[3] Table sorting using jQuery stupidtable.js plugin

Initialization of plugin with cdn scripts and css

Basic Setup – specify data attributes for sorting

Sorting table with stupidtable() method

jQuery stupidtable() plugin demo


Grab code using view source

Share and Enjoy

  • DZone
  • Google Plus
  • LinkedIn
  • Twitter
  • Facebook
  • Email

  • Tulasi Raj Kishore

    “Prevent this page from creating additional dialogs” .how to over come this alert message in Mozilla Firefox .

    • vikaskbh

      You can’t. If you want to force user to see all alert box try custom UI alerts like jQuery UI dialog etc.

  • Tulasi Raj Kishore

    thank you

  • http://joequery.me/ Joseph McCullough

    Hi! Thanks for linking to the stupidtable. However, rawgithub does not want to be treated like a CDN. If too many people request that js file directly, they’ll restrict access (and break my demo page).

    • vikaskbh

      Hello, cdnjs sources added.