FooTable V2 Released

It has taken months of work, but the FooTable jQuery Plugin V2 is now officially released. If you do not know what FooTable is, then simply put: FooTable is a jQuery plugin that makes your HTML tables responsive.

A lot has changed in V2 and here is a summary:

Bootstrap Love

I chose to rather go with a Bootstrap default theme in V2, which makes it much easier to customize. You can still get the old theme if you want, but that is now a separate CSS file.

  • Gettings started demo (uses default Bootstrap theme)
  • Metro theme demo
  • Old FooTable theme demo

Demos & Docs

I paid most attention to the demos and docs with this release. The documentation is now built into the demos so you can see it in action and read how it works. I am really proud of the docs and I hope you find them useful.

Icon Fonts

Bye bye images, hello icon fonts. The toggle buttons and sorting icons now use icon fonts. This allows for better customization, and also has a smaller footprint in terms of data that the user has to download. Check out the icon styles demo to see them all in action.

Improved Events

FooTable now has a number of events that you can hook into. The beauty about some of them now, is that you can override an event and cancel if you need to. Think about loading tables via AJAX, where you control the sorting or filtering on the server. Being able to override the events is sometimes crucial.

  • FooTable events demo
  • Event interception demo

Improved API

One of the major pain points when using FooTable was not being able to call the underlying FooTable functions after the plugin was initialized. FooTable core, together with the available add-on’s now expose an easy way to call their functions. You can now force the table to resize, sort by a specific column, filter the table etc all in your jQuery code. Check out the following demos and read up on the docs tab to see more about these API’s:

  • FooTable API demo
  • Sorting add-on demo
  • Filtering add-on demo
  • Paging add-on demo

Another thing you can now do really easily is add or remove rows via a few methods on the FooTable API. Check out the Add / Remove demo to see this in action.

WordPress Plugin

The WordPress plugin has also been updated to use the latest FooTable jQuery code. There are also some improvements and cool features which I will highlight in a future post.

Quick Links

  • FooTable Homepage
  • GitHub Repo
  • Demo Showcase
  • WordPress Plugin
  • WordPress GitHub Repo