row().child().show()

Since: DataTables 1.10

Make newly defined child rows visible.

Description

When using row().child() to attach child rows to a parent row, you will often want to make the child rows immediately visible. This method provides that ability as a simple chaining method.

Please note that this method is only available when row().child() is called with a parameter set. This is because row().child() will return the child rows if called with no parameters, which is either a jQuery object or undefined. When called with a parameter row().child() returns a DataTables.Api instance. If you need to display a child row without any parameters being set use row().child.show().

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().show()

Description:

Show the child row(s) of a parent row

Returns:

DataTables API instance.

Example

Show / hide a row based on its current state, adding the row content as needed.:

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

$('#example tbody').on('click', 'td.details-control', function () {
	var tr = $(this).parents('tr');
	var row = table.row( tr );

	if ( row.child.isShown() ) {
		// This row is already open - close it
		row.child.hide();
		tr.removeClass('shown');
	}
	else {
		// Open this row (the format() function would return the data to be shown)
		row.child( format(row.data()) ).show();
		tr.addClass('shown');
	}
} );