Preamble

DataTables adding rows in DataTables is done by assigning the DataTables jQuery object to a variable when initialising it, and then using it's API methods to add a new row. Deleting rows can be done in a similar manner.

Live example

Click to add a new row

Initialisation code

/* Global variable for the DataTables object */
var oTable;

/* Global var for counter */
var giCount = 2;

$(document).ready(function() {
	oTable = $('#example').dataTable();
} );

function fnClickAddRow() {
	oTable.fnAddData( [
		giCount+".1",
		giCount+".2",
		giCount+".3",
		giCount+".4" ] );
	
	giCount++;
}

Other examples

Basic initialisation

• Zero configuration
• Feature enablement
• Sorting data
• Multi-column sorting
• Multiple tables
• Hidden columns
• Change language information (internationalisation)
• DOM positioning
• Alternative pagination styles

Advanced initialisation

• Column rendering
• Sorting without HTML tags
• Row callback
• Footer callback
• Change language information from a file (internationalisation)

API

• Dynamically add a new row
• Dynamically create a table
• Individual column filtering
• User selectable rows

Please refer to the DataTables documentation for full information about it's API properties and methods.