HTML Table Filter Generator

This demo shows how to combine 2 instances of the filters: a single filter and the column filters generated automatically.


		var totRowIndex = tf_Tag(tf_Id('demo'),"tr").length;	
		var config = {
			sort: true,
			filters_row_index: 1,
			alternate_rows: true,
			rows_counter: true,
			rows_counter_text: "Displayed rows: ",
			btn_reset: true,
			loader: true,
			loader_css_class: 'myLoader',
			status_bar: true,
			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],
			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,
			
			//Callback event raised when filters are generated
			on_filters_loaded: function(o){
				//Custom single filter element property
				o.singleFlt = tf_Id('inpSingleSearch');
				
				//Custom single filter search method
				o.singleFilterSearch = function(val){
					o.singleSearchFlt = true; //single filter property
					o.SetFilterValue(0, val); //public method for setting a filter value (first column filter = single filter) 
					o.Filter(); //public method to filter table
					o.singleFlt.blur();
				}
				
				//Overrides Clear filters public method in order to clear also custom single filter
				o.ClearFilters = function(){
					//Event manager: clear filters
					o.EvtManager(o.Evt.name.clear); 
					//custom single filter is cleared
					o.ClearSingleFilter();
				}
				
				//Custom single filter clear method
				o.ClearSingleFilter = function(){ o.singleFlt.value = ''; }
			},
			
			//Callback event raised when after filtering process is executed
			on_after_filter: function(o){
				if(o.singleSearchFlt) o.SetFilterValue(0, ''); //first column filter is cleared
				o.singleSearchFlt = false; //single filter property is disabled
			}
	
		}
		var tf = setFilterGrid("demo", config);
	
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