How to Add new row to datatable using jquery datatable

This post shows you how to add new row to datatable using jquery

For example

<table border="1">
        <tr><td>Customer ID</td><td>Customer Name</td>

You can use fnAddData to add row with an array of the values that you want to add.

var table = $('#tbl').DataTable();
var total =;
var column1 = 'col 1';
var column2 = 'col 2';
$('#tbl').dataTable().fnAddData([column1, column2 ]);

If you want to embed html control you can write.

var column1 = '<input type="text" id="AddressList_' + total + '__Name" name="AddressList[' + total + '].Name" value="' + data.Name + '">';

And from version 1.10 you can use row.add() method

var newRow = "<tr><td>col 1</td><td>col 2</td></tr>";
var table = $('#tbl').DataTable();
table.row.add($(newRow )).draw();