HTML Table Filter Generator

This demo shows how pass url parameters to the TF object and filter the table with those values. First argument after ? or & represents the column index, second argument the query

Try following values:
your url...?0=gmail (0 = column index, gmail = query)
your url...?1=45834
your url...?3=>3000&5=flexo
your url...?6=<1/1/2000&3=<1000
your url...?3=>2000~~<3500 (&& operator sign is replaced by ~~ in order to work inside a url context)
your url...?3=>2000~~<3500&4=>2200~~<3100 (&& operator sign is replaced by ~~ in order to work inside a url context)

Use refresh button of your browser in order to reload the page every time you change url parameters

Email Id Phone US $ Url EU Date US Date DD MMM YYYY
Tot
devo@flexomat.com 66672 941-964-8535
2.482,79
2,482.79
http://gmail.com 14/12/1988 12/14/1988 14-Dec-1988
henry@mountdev.net 35889 941-964-9543
2.776,09
2,776.09
http://www.gmail.com 19/1/1984 1/19/1984 19-Jan-1984
christian@reno.gov 60021 941-964-5617
2.743,41
2,743.41
http://www.dotnet.ca 25/3/2000 3/25/2000 25-Mar-2000
muffins@donuts.com 17927 941-964-9511
2.998,18
2,998.18
http://google.se 24/1/1993 1/24/1993 24-Jan-1993
muffins@reno.gov 76375 941-964-2757
1.836,09
1,836.09
http://www.samba.org 4/4/1988 4/4/1988 4-Apr-1988
mendez@gmail.com 45834 941-964-2575
2.805,46
2,805.46
http://flexomat.com 12/12/1985 12/12/1985 12-Dec-1985
dev@gmail.com 20022 941-964-4967
3.296,54
3,296.54
http://www.flexomat.com 3/7/2002 7/3/2002 3-Jul-2002
foo@polyester.se 55987 941-964-745
2.953,73
2,953.73
http://www.donuts.com 4/8/1987 8/4/1987 4-Aug-1987
adam@aftonbladet.se 38867 941-964-6302
1.949,27
1,949.27
http://flexomat.com 27/7/1995 7/27/1995 27-Jul-1995
devo@donuts.com 51426 941-964-1234
1.067,00
1,067.00
http://www.polyester.se 5/1/1986 1/5/1986 5-Jan-1986
henry@samba.org 40859 941-964-4856
3.401,19
3,401.19
http://www.flexomat.com 7/3/1990 3/7/1990 7-Mar-1990
found@dotnet.ca 23986 941-964-2686
1.393,52
1,393.52
http://lostnfound.org 22/7/1993 7/22/1993 22-Jul-1993
carl@fish.org 73392 941-964-5792
3.876,04
3,876.04
http://www.google.se 14/7/1984 7/14/1984 14-Jul-1984
found@mountdev.net 03519 941-964-1599
1.176,48
1,176.48
http://donuts.com 6/8/2000 8/6/2000 6-Aug-2000
lost@fish.org 36628 941-964-5985
822,23
822.23
http://www.gmail.com 14/7/1994 7/14/1994 14-Jul-1994
mendez@dotnet.ca 90442 941-964-1649
1.985,72
1,975.72
http://reno.gov 20/10/1997 10/20/1997 20-Oct-1997
carl@donuts.com 00412 941-964-6432
1.834,77
1,834.77
http://gmail.com 23/8/1997 8/23/1997 23-Aug-1997
foo@fish.org 80653 941-964-1022
260,26
260.26
http://samba.org 24/11/1991 11/24/1991 24-Nov-1991
found@fish.org 54635 941-964-6439
1.442,80
1,442.80
http://dotnet.ca 12/7/1987 7/12/1987 12-Jul-1987
found@flexomat.com 20953 941-964-5544
575,42
575.42
http://gmail.com 10/6/1988 6/10/1988 10-Jun-1988

 

		var totRowIndex = tf_Tag(tf_Id('demo'),"tr").length;	
		var props = {
			col_1: 'select',
			sort: true,
			filters_row_index: 1,
			alternate_rows: true,
			rows_counter: true,
			rows_counter_text: "Displayed rows: ",
			btn_reset: true,
			btn_reset_text: "Clear",
			loader: true,
			loader_html: '',
			loader_css_class: 'myLoader',
			status_bar: true,
			status_bar_target_id: 'lblStatus',
			col_number_format: [null,null,null,'EU','US',null,null,null,null],
			col_date_type: [null,null,null,null,null,null,'dmy','mdy','ddmmmyyyy'],
			rows_always_visible:[totRowIndex],
			and_operator: '~~', // '&&' by default, needs to be changed in order to work inside a URL
			col_operation: {
				id: ["sum1","sum2"],  
				col: [3,4],  
				operation: ["sum","sum"],  
				write_method: ["innerhtml",'innerhtml'],  
				exclude_row: [totRowIndex],  
				decimal_precision: [2,2],
				tot_row_index: [totRowIndex]
			  },
			on_after_operation: formatTotals,
			on_filters_loaded: function(o){
				var url = window.location.href; //window url
				if(url.split('?').length > 1)
				{
					var params = url.split('?')[1]; //isolate url params
					for(var i=0; i<params.split('&').length; i++){
						var paramCol = params.split('&')[i].split('=')[0]; //isolate column index
						var paramCriteria = unescape(params.split('&')[i].split('=')[1]); //isolate criteria
						o.SetFilterValue(paramCol, paramCriteria); //public method to set a column filter value - http://tablefilter.free.fr/doc_methods.php
					}
					o.Filter(); //public method to filter the table - http://tablefilter.free.fr/doc_methods.php
				}
			}
		}
		var tf = setFilterGrid("demo",props);