Awesome Table: Preset filters in URL
Post date: Dec 19, 2014 6:7:46 PM
Using filters in Awesome Table to quickly drill down the displayed data is great. But a lot of users have asked for ways to load a table with some filters already selected (to provide direct links to the most interesting data for specific users) so our latest improvement allows you to set a filtered view directly from the URL of the page.
Let's take an example
We will take a People Directory as an example throughout this post.
The URL is built by adding the option filter[name of the column in the spreadsheet]=[comma separated filter settings]
Example :
This will only display rows with 'France' or 'Spain' in column F (assuming a CategoryFilter was used on this column).
Detailed settings for each filter
It works for all filters, but parameters are a bit different.
StringFilter
One parameter : it's the content of the string field.
Filtering for 'FOURNIER' in the Name filter of the sample people directory : /awesome-tables/people-directory?filterB=FOURNIER
CategoryFilter / csvFilter
Comma separated values
As above, filtering for people living in France or Spain : /awesome-tables/people-directory?filterF=France,Spain
Number filter
Two values : start and end of the range
Filtering for weight between 50 and 70 kg : /awesome-tables/people-directory?filterK=50,70
DateFilter
Two parameters : start and end of the range
In this case, it's a little tricky, the date need to converted to a number. You can use this site to convert dates to numbers.
People born between 01/01/1975 and 01/01/1980 : /awesome-tables/people-directory?filterL=157762800000,315529200000
Combining filters
Of course, you can use multiple filters at once, giving you the maximum control on your Awesome Table URL links.
For example, here's a custom link to filter on people living in England and weighting between 70 and 90 kg:
/awesome-tables/people-directory?filterF=England&filterK=70,90
Advanced stuff
Some of you may have thought of data non URL-friendly, as text containing '/'. This is also taken in account, as each parameters are passed through the decodeURIComponent() JavaScript function. To be sure of using correctly formatted parameters, use encodeURIComponent() on each of them. This is all the more important when the parameters are unknown text value.
To link data containing a space on legacy Google Site, like 'Google Apps' on the csvfilter Skills & Expertise, replace the spaces by %26%2332;
/awesome-tables/people-directory?filterH=Google%26%2332;Apps
Note: This is necessary because Google Site replace spaces by '+' in URLs.