Creating a ruleset from scratch - "Hello World" example

A table preset or template in Tabulizer's terminology is called ruleset because it is much more than visual styling. A ruleset contains a set of rules that can do much more, including:

  • Data calculations
  • Data formatting
  • Data/text replacements
  • Cell merging
  • Client-side table sorting
  • Client-side search filtering
  • Table pagination
  • Table splitting
  • Table to graph conversion

Each rule applies to a table element, that can be:

  • a table row(s)
  • a table column(s)
  • a table cell(s)
  • the whole table

Many rules can apply to the same element, so in some cases the order of execution is may be important. In any case, one or more rules are contained in a ruleset (i.e. set of rules), and one or more rulesets are contained in a ruleset archive. The ruleset archive is a collection of files that are zipped together in a single file, the archive file that has the *.zip extension.

If you use the online creation wizard at www.tabulizer.com or the online graph creation wizard the archive file is created automatically for you based on your preferences. In this example, we will not use the online wizards, but instead we will create the ruleset archive from scratch. The simplest case is when we have one ruleset archive that contains one ruleset that contains a one rule. Just for this example, this rule will add a search filter on top of the table.

Solving jquery conflicts in Joomla with Tabulizer jQuery plugin

Many advanced Tabulizer features, like table sorting, search filtering and pagination are making use of the jQuery library. This is a non standard javascript library in Joomla system and as result conflicts between different versions of the jQuery used by various Joomla extensions may cause problems.

If that is the case, you could use a system plugin designed specifically for that purposed named System -Tabulizer jQuery. By setting its parameter Remove Path(s) approprietly you can select which version of jQuery stays and which are removed or replaced.

How to make responsive an article table

With the huge market penetration of the various mobile devices (smartphones, tablets, etc) the need to adjust automatically the width and height of your site elements according the the screen size of the end user is clear. Responsive Web Design (RWD) is not a particular tool or implementation, but rather a design methodology that aims to provide an optimal viewing experience—easy reading and navigation with a minimum of resizing, panning, and scrolling—across a wide range of devices (from mobile phones to desktop computer monitors).

Tabulizer brings responsiveness to your tables with just a few clicks. More specifically it supports out of the box the most popular responsive design patterns for tables:

  1. Responsive Design Pattern - Horizontal Scrollbar [View Demo]
  2. Responsive Design Pattern - Header Selection [View Demo]
  3. Responsive Design Pattern - Fixed Headers + Expand [View Demo]
  4. Responsive Design Pattern - Fixed Left Header + Scroll [View Demo]
  5. Responsive Design Pattern - Table Reflow [View Demo]
  6. Responsive Design Pattern - Flip Headers [View Demo]

Adding sorting capabilities to your table

One of the highly used features of Tabulizer is the client-side sorting capabilities that can add to your table. In other words, you can add a rule so table is sorted (ascending/descending order) by clicking on the table header row.

Rank Fastest time (s) Wind Athlete Country Date Location
1 9.58 +0.9 Usain Bolt Jamaica 16 August 2009 Berlin
2 9.69 +2.0 Tyson Gay United States 20 September 2009 Shanghai
3 9.72 +0.2 Asafa Powell Jamaica 2 September 2008 Lausanne
4 9.78 +0.9 Nesta Carter Jamaica 29 August 2010 Rieti
5 9.79 +0.1 Maurice Greene United States 16 June 1999 Athens
6 9.79 +1.5 Justin Gatlin United States 5 August 2012 London
7 9.80 +1.3 Steve Mullings Jamaica 4 June 2011 Eugene
8 9.84 +0.7 Donovan Bailey Canada 27 July 1996 Atlanta
9 9.84 +0.2 Bruny Surin Canada 22 August 1999 Seville
10 9.85 +1.2 Leroy Burrell United States 6 July 1994 Lausanne
11 9.85 +1.7 Olusoji Fasuba Nigeria 12 May 2006 Ad-Dawhah
12 9.85 +1.3 Mike Rodgers United States 4 June 2011 Eugene