row().child.hide()

Since: DataTables 1.10

Hide the child row(s) of a parent row.

Description

This method can be used to make the child rows of a parent row hidden at any time. When child row(s) are set as hidden they are not detached from the parent row, but rather simply not drawn on the page. This method provides a way of hiding a row at any required time.

Unlike many of the other methods which manipulate the DataTable, this method does not require draw() to be called for the resulting change to be displayed. The child row(s) are inserted into the table without requiring that DataTables redraw.

Type

function row().child.hide()

Description:

Hide the child row(s) of a parent row

Returns:

DataTables API instance.

Example

Create detail rows initially, but don't show them until the row is clicked upon and hide on second click:

var table = $('#example').DataTable();

table.rows().every( function () {
	this.child( 'Row details for row: '+this.index() );
} );

$('#example tbody').on( 'click', 'tr', function () {
	var child = table.row( this ).child;

	if ( child.isShown() ) {
		child.hide();
	}
	else {
		child.show();
	}
} );