First you need to include the script's javascript file (tablefilter.js) in the
head section of your web page- <script type="text/javascript" language="javascript" src="TableFilter/tablefilter.js"></script>
and make sure that the table you'd like to make filterable has a unique
id.
Here you have an example of a regular html table:
| From | Destination | Road Distance (km) | By Air (hrs) | By Rail (hrs) |
|---|---|---|---|---|
| Sydney | Adelaide | 1412 | 1.4 | 25.3 |
| Sydney | Brisbane | 982 | 1.5 | 16 |
| Sydney | Canberra | 286 | .6 | 4.3 |
| Sydney | Melbourne | 872 | 1.1 | 10.5 |
| Adelaide | Perth | 2781 | 3.1 | 38 |
| Adelaide | Alice Springs | 1533 | 2 | 20.25 |
| Adelaide | Brisbane | 2045 | 2.15 | 40 |
Below the same table with a filtering grid generated automatically (
id="table1"):| From | Destination | Road Distance (km) | By Air (hrs) | By Rail (hrs) |
|---|---|---|---|---|
| Sydney | Adelaide | 1412 | 1.4 | 25.3 |
| Sydney | Brisbane | 982 | 1.5 | 16 |
| Sydney | Canberra | 286 | .6 | 4.3 |
| Sydney | Melbourne | 872 | 1.1 | 10.5 |
| Adelaide | Perth | 2781 | 3.1 | 38 |
| Adelaide | Alice Springs | 1533 | 2 | 20.25 |
| Adelaide | Brisbane | 2045 | 2.15 | 40 |
No comments :
Post a Comment