HTML Table Filter Generator

This demo shows how to easily implement the Columns Visibility Manager add-on with the Extensions manager (extensions property) .

Columns Visibility Manager implementation steps:
  1. Download and extract the Columns Visibility Manager extension at same location than tablefilter.js document
  2. Make sure that the folder TFExt_ColsVisibility containing extensions files exists
  3. Use the extensions property (extensions manager) in your configuration object to load the extension:
    ...
    extensions: {
    name:['ColsVisibility'],
    src:['TableFilter/TFExt_ColsVisibility/TFExt_ColsVisibility.js'],
    description:['Columns visibility manager'],
    initialize:[function(o){o.SetColsVisibility();}]
    },
    ...
  4. Then use the additional extension's properties to configure the Columns Visibility Manager
country isocode year POP XRAT PPP cgdp cc ci
ChinaCHN19941190918.02 8.618742943 1.662551.97 50.06 22.34
ChinaCHN19951203324.03 8.351416588 1.912759.92 51.68 22.47
ChinaCHN19961215414.27 8.314174652 2.022972.61 51.88 22.04
ChinaCHN19971227176.70 8.289816856 2.033141.07 49.97 21.82
ChinaCHN19981238599.42 8.278958321 1.983317.79 49.44 21.60
ChinaCHN19991249981.56 8.278249741 1.953483.39 50.55 21.00
ChinaCHN20001258821.03 8.278504372 1.923843.67 48.66 21.09
Cote d`IvoireCIV199413132.24 555.2047119 177.721824.83 74.25 4.88
Cote d`IvoireCIV199513528.00 499.148407 189.401947.14 77.07 5.49
Cote d`IvoireCIV199613888.77 511.5523987 200.961958.75 74.25 5.55
Cote d`IvoireCIV199714731.84 583.6693726 215.121969.64 76.36 4.85
Cote d`IvoireCIV199815159.11 589.9517822 216.902055.67 77.11 5.65
Cote d`IvoireCIV199915586.39 615.6990967 213.222057.57 75.24 6.31
Cote d`IvoireCIV200016013.00 711.9763184 205.652027.57 76.76 5.75
CameroonCMR199412822.14 555.2047119 148.621790.50 83.49 5.30
CameroonCMR199513182.00 499.148407 169.281851.73 81.81 4.73
CameroonCMR199613548.75 511.5523987 178.061894.69 83.46 4.93
CameroonCMR199713917.84 583.6693726 177.172005.02 84.39 5.02
CameroonCMR199814238.86 589.9517822 182.472018.38 84.45 5.46
CameroonCMR199914558.39 615.6990967 188.101976.34 84.65 5.79
CameroonCMR200014876.00 711.9763184 170.402300.75 81.14 5.41
Congo, Republic ofCOG19942489.45 555.2047119 310.221324.26 65.37 11.94
Congo, Republic ofCOG19952561.00 499.148407 295.661394.88 62.36 8.44
Congo, Republic ofCOG19962633.72 511.5523987 285.411728.93 58.65 7.39
Congo, Republic ofCOG19972707.60 583.6693726 271.761842.43 57.40 4.65
Congo, Republic ofCOG19982782.62 589.9517822 273.511511.04 85.72 5.49
Congo, Republic ofCOG19992933.76 615.6990967 273.991698.51 57.27 4.42
Congo, Republic ofCOG20003018.00 711.9763184 287.162532.80 44.71 2.61
ColombiaCOL199437806.85 844.8358765 353.635046.53 71.19 15.83
ColombiaCOL199538558.00 912.826416 411.675323.44 71.11 15.77
ColombiaCOL199639285.00 1036.686035 474.225528.80 69.81 14.73
ColombiaCOL199740042.00 1140.963013 531.485718.57 69.22 14.03
ColombiaCOL199840804.00 1426.036987 611.565642.37 69.45 12.81
ColombiaCOL199941539.00 1756.230957 644.455565.99 67.11 7.84
ColombiaCOL200042299.30 2087.904053 691.015795.55 67.93 8.79
ComorosCOM1994479.57 416.3988037 92.721739.48 90.86 6.47
ComorosCOM1995492.00 374.3570862 99.761636.91 88.22 6.79
ComorosCOM1996504.68 383.6600037 102.871576.51 89.35 6.95
ComorosCOM1997517.62 437.7471008 104.401732.11 92.65 6.09
ComorosCOM1998530.82 442.4588013 104.771714.75 84.20 6.50
ComorosCOM1999544.28 461.7745972 104.581803.57 85.71 4.78
ComorosCOM2000558.00 533.9824829 105.981822.83 79.76 4.30
Cape VerdeCPV1994371.97 81.89083099 31.382882.44 83.45 21.97
Cape VerdeCPV1995382.00 76.85333252 31.713125.81 81.02 21.03
Cape VerdeCPV1996392.64 82.59146881 32.403194.10 80.03 19.19
Cape VerdeCPV1997403.56 93.17666626 35.123327.25 81.66 17.42
Cape VerdeCPV1998415.32 98.15750122 36.713473.71 90.39 15.55
Cape VerdeCPV1999427.79 102.6999969 36.803835.69 85.86 15.58
Cape VerdeCPV2000441.00 115.8766022 34.124299.18 76.33 13.79
Costa RicaCRI19943266.00 157.0666962 76.785208.04 65.10 18.10
Costa RicaCRI19953333.00 179.7292023 90.105398.01 63.86 16.01
Costa RicaCRI19963398.00 207.6891937 108.505150.77 65.34 13.86
Costa RicaCRI19973576.91 232.5975037 159.715233.97 65.46 16.36
Costa RicaCRI19983653.06 257.229187 175.865653.65 63.56 18.50
Costa RicaCRI19993731.07 285.6846924 197.926072.26 60.20 14.81
Costa RicaCRI20003811.00 308.1867065 218.495872.79 62.16 14.11
CubaCUB199410960.49 1 0.364895.96 71.25 0.97
CubaCUB199510998.53 1 0.404980.82 72.19 1.31
CubaCUB199611038.60 1 0.395259.40 72.36 1.54
CubaCUB1997na na nana na na
CubaCUB1998na na nana na na
CubaCUB1999na na nana na na
CubaCUB2000na na nana na na
CyprusCYP1994726.00 0.492190987 0.3713616.58 61.28 18.47
CyprusCYP1995733.00 0.452420205 0.3415920.39 62.64 20.32
CyprusCYP1996740.00 0.466311306 0.3515813.21 66.27 17.88
CyprusCYP1997na na nana na na
CyprusCYP1998na na nana na na
CyprusCYP1999na na nana na na
CyprusCYP2000na na nana na na
Czech RepublicCZE199410333.60 28.7851 9.7411756.62 68.20 21.63
Czech RepublicCZE199510327.30 26.5407 10.6512551.75 67.55 25.24
Czech RepublicCZE199610315.30 27.1449 11.2913457.73 69.29 25.85
Czech RepublicCZE199710303.00 31.6984 11.8713734.32 69.24 24.80
Czech RepublicCZE199810293.60 32.2812 12.5614213.23 66.54 23.27
Czech RepublicCZE199910285.00 34.5692 12.7514393.17 67.97 21.81
Czech RepublicCZE200010272.10 38.5984 12.8514844.00 67.42 24.21
	var props = {
		paging: true,
		sort: true,
		sort_config: {
			sort_types:['String','String','US','US','US','US','US','US','US']
		},
		remember_grid_values: true,
		alternate_rows: true,
		rows_counter: true,
		btn_reset: true,
		btn_reset_text: "Clear",
		status_bar: true,
		col_0: "select",
		col_1: "select",
		col_2: "select",
		display_all_text: "< Show all >",
		
		/*** Extensions manager ***/
		extensions: { 
						/*** Columns Visibility Manager extension load ***/	
						name:['ColsVisibility'], 
						src:['TableFilter/TFExt_ColsVisibility/TFExt_ColsVisibility.js'], 
						description:['Columns visibility manager'], 
						initialize:[function(o){o.SetColsVisibility();}] 
					},
					
		/*** Columns Visibility Manager extension properties ***/
		showHide_cols_at_start: [3,5],
		showHide_cols_text: 'Columns: ',
		showHide_enable_tick_all: true
	}
	setFilterGrid("demo",props);
	
country isocode year POP XRAT PPP cgdp cc ci
ChinaCHN19941190918.02 8.618742943 1.662551.97 50.06 22.34
ChinaCHN19951203324.03 8.351416588 1.912759.92 51.68 22.47
ChinaCHN19961215414.27 8.314174652 2.022972.61 51.88 22.04
ChinaCHN19971227176.70 8.289816856 2.033141.07 49.97 21.82
ChinaCHN19981238599.42 8.278958321 1.983317.79 49.44 21.60
ChinaCHN19991249981.56 8.278249741 1.953483.39 50.55 21.00
ChinaCHN20001258821.03 8.278504372 1.923843.67 48.66 21.09
Cote d`IvoireCIV199413132.24 555.2047119 177.721824.83 74.25 4.88
Cote d`IvoireCIV199513528.00 499.148407 189.401947.14 77.07 5.49
Cote d`IvoireCIV199613888.77 511.5523987 200.961958.75 74.25 5.55
Cote d`IvoireCIV199714731.84 583.6693726 215.121969.64 76.36 4.85
Cote d`IvoireCIV199815159.11 589.9517822 216.902055.67 77.11 5.65
Cote d`IvoireCIV199915586.39 615.6990967 213.222057.57 75.24 6.31
Cote d`IvoireCIV200016013.00 711.9763184 205.652027.57 76.76 5.75
CameroonCMR199412822.14 555.2047119 148.621790.50 83.49 5.30
CameroonCMR199513182.00 499.148407 169.281851.73 81.81 4.73
CameroonCMR199613548.75 511.5523987 178.061894.69 83.46 4.93
CameroonCMR199713917.84 583.6693726 177.172005.02 84.39 5.02
CameroonCMR199814238.86 589.9517822 182.472018.38 84.45 5.46
CameroonCMR199914558.39 615.6990967 188.101976.34 84.65 5.79
CameroonCMR200014876.00 711.9763184 170.402300.75 81.14 5.41
Congo, Republic ofCOG19942489.45 555.2047119 310.221324.26 65.37 11.94
Congo, Republic ofCOG19952561.00 499.148407 295.661394.88 62.36 8.44
Congo, Republic ofCOG19962633.72 511.5523987 285.411728.93 58.65 7.39
Congo, Republic ofCOG19972707.60 583.6693726 271.761842.43 57.40 4.65
Congo, Republic ofCOG19982782.62 589.9517822 273.511511.04 85.72 5.49
Congo, Republic ofCOG19992933.76 615.6990967 273.991698.51 57.27 4.42
Congo, Republic ofCOG20003018.00 711.9763184 287.162532.80 44.71 2.61
ColombiaCOL199437806.85 844.8358765 353.635046.53 71.19 15.83
ColombiaCOL199538558.00 912.826416 411.675323.44 71.11 15.77
ColombiaCOL199639285.00 1036.686035 474.225528.80 69.81 14.73
ColombiaCOL199740042.00 1140.963013 531.485718.57 69.22 14.03
ColombiaCOL199840804.00 1426.036987 611.565642.37 69.45 12.81
ColombiaCOL199941539.00 1756.230957 644.455565.99 67.11 7.84
ColombiaCOL200042299.30 2087.904053 691.015795.55 67.93 8.79
ComorosCOM1994479.57 416.3988037 92.721739.48 90.86 6.47
ComorosCOM1995492.00 374.3570862 99.761636.91 88.22 6.79
ComorosCOM1996504.68 383.6600037 102.871576.51 89.35 6.95
ComorosCOM1997517.62 437.7471008 104.401732.11 92.65 6.09
ComorosCOM1998530.82 442.4588013 104.771714.75 84.20 6.50
ComorosCOM1999544.28 461.7745972 104.581803.57 85.71 4.78
ComorosCOM2000558.00 533.9824829 105.981822.83 79.76 4.30
Cape VerdeCPV1994371.97 81.89083099 31.382882.44 83.45 21.97
Cape VerdeCPV1995382.00 76.85333252 31.713125.81 81.02 21.03
Cape VerdeCPV1996392.64 82.59146881 32.403194.10 80.03 19.19
Cape VerdeCPV1997403.56 93.17666626 35.123327.25 81.66 17.42
Cape VerdeCPV1998415.32 98.15750122 36.713473.71 90.39 15.55
Cape VerdeCPV1999427.79 102.6999969 36.803835.69 85.86 15.58
Cape VerdeCPV2000441.00 115.8766022 34.124299.18 76.33 13.79
Costa RicaCRI19943266.00 157.0666962 76.785208.04 65.10 18.10
Costa RicaCRI19953333.00 179.7292023 90.105398.01 63.86 16.01
Costa RicaCRI19963398.00 207.6891937 108.505150.77 65.34 13.86
Costa RicaCRI19973576.91 232.5975037 159.715233.97 65.46 16.36
Costa RicaCRI19983653.06 257.229187 175.865653.65 63.56 18.50
Costa RicaCRI19993731.07 285.6846924 197.926072.26 60.20 14.81
Costa RicaCRI20003811.00 308.1867065 218.495872.79 62.16 14.11
CubaCUB199410960.49 1 0.364895.96 71.25 0.97
CubaCUB199510998.53 1 0.404980.82 72.19 1.31
CubaCUB199611038.60 1 0.395259.40 72.36 1.54
CubaCUB1997na na nana na na
CubaCUB1998na na nana na na
CubaCUB1999na na nana na na
CubaCUB2000na na nana na na
CyprusCYP1994726.00 0.492190987 0.3713616.58 61.28 18.47
CyprusCYP1995733.00 0.452420205 0.3415920.39 62.64 20.32
CyprusCYP1996740.00 0.466311306 0.3515813.21 66.27 17.88
CyprusCYP1997na na nana na na
CyprusCYP1998na na nana na na
CyprusCYP1999na na nana na na
CyprusCYP2000na na nana na na
Czech RepublicCZE199410333.60 28.7851 9.7411756.62 68.20 21.63
Czech RepublicCZE199510327.30 26.5407 10.6512551.75 67.55 25.24
Czech RepublicCZE199610315.30 27.1449 11.2913457.73 69.29 25.85
Czech RepublicCZE199710303.00 31.6984 11.8713734.32 69.24 24.80
Czech RepublicCZE199810293.60 32.2812 12.5614213.23 66.54 23.27
Czech RepublicCZE199910285.00 34.5692 12.7514393.17 67.97 21.81
Czech RepublicCZE200010272.10 38.5984 12.8514844.00 67.42 24.21
	var props2 = {
		remember_grid_values: true,
		alternate_rows: true,
		rows_counter: true,
		btn_reset: true,
		btn_reset_text: "Clear",
		status_bar: true,
		status_bar_target_id: 'mdiv_demo2',
		col_0: "select",
		col_1: "select",
		col_2: "select",
		display_all_text: "< Show all >",
		
		/*** Extensions manager ***/
		extensions: { 
						/*** Columns Visibility Manager extension load ***/	
						name:['ColsVisibility'], 
						src:['TableFilter/TFExt_ColsVisibility/TFExt_ColsVisibility.js'], 
						description:['Columns visibility manager'], 
						initialize:[function(o){o.SetColsVisibility();}] 
					},
					
		/*** Columns Visibility Manager extension properties ***/
		showHide_cols_tick_to_hide: false,
		btn_showHide_cols_target_id: 'spnColMng',
		showHide_cols_container_target_id: 'colsMng',
		showHide_cols_at_start: [5,6],
		btn_showHide_cols_html: '',
		btn_showHide_cols_close_html: '',
		showHide_cols_text: 'Check options to hide columns: ',
		showHide_cols_cont_css_class: 'colsMngContainer',
		showHide_cols_enable_hover: false,
		on_before_open_cols_manager: hideIESelects,
		on_after_close_cols_manager: showIESelects
	}
	setFilterGrid("demo2",props2);