Preamble

ColVis is a plug-in for DataTables which presents a list of all columns to a user and allows them to select which ones they wish to be visible. Click the 'Show / hide columns' button to be presented with a list of columns in the table, and click the buttons to show and hide them as you wish.

Live example

Show / hide columns

Show 102550100 entries

Search:

Rendering engine	Browser	Platform(s)	Engine version	CSS grade
Rendering engine	Browser	Platform(s)	Engine version	CSS grade
Gecko	Firefox 1.5	Win 98+ / OSX.2+	1.8	A
Gecko	Firefox 2.0	Win 98+ / OSX.2+	1.8	A
Gecko	Firefox 3.0	Win 2k+ / OSX.3+	1.9	A
Gecko	Camino 1.0	OSX.2+	1.8	A
Gecko	Camino 1.5	OSX.3+	1.8	A
Gecko	Netscape 7.2	Win 95+ / Mac OS 8.6-9.2	1.7	A
Gecko	Netscape Browser 8	Win 98SE+	1.7	A
Gecko	Netscape Navigator 9	Win 98+ / OSX.2+	1.8	A
Gecko	Mozilla 1.0	Win 95+ / OSX.1+	1	A
Gecko	Mozilla 1.1	Win 95+ / OSX.1+	1.1	A

Showing 1 to 10 of 57 entries

PreviousNext

Examples

• Basic initialisation
• Activate with a mouseover rather than click
• Custom text in the button
• Using with jQuery UI ThemeRoller
• Excluding columns from the show / hide list
• Two tables initialised together - individual controls
• Two tables initialised together - shared control
• Alternative styling and reset to original
• Customisation of the button label with a callback

Initialisation code

$(document).ready( function () {
	$('#example').dataTable( {
		"sDom": 'C<"clear">lfrtip'
	} );
} );