CODEWITHSUNDEEP
javascriptjqueryappenddatatablesclone
triplethreat77
triplethreat77

Reputation: 1296

Add new row to Datatable from table values?

I have a Datatable with information, and a fieldset with a table full of text inputs. The user should be able to add new rows according to the information values, but these rows are not correctly adding. Clearly the tr is being cloned and added (emptied where needed), the corresponding values are appending but the pagination is not being updated for Datatables. I cannot figure out how to correctly use .fnAddData() to get the job done here. On top of that, I don't know how to go about the "Permissions" column - getting checkboxes to convert to text for the table. Any ideas? Thanks in advance.

http://jsfiddle.net/BWCBX/28/

jQuery

$('#addRow').click(function () {
    var tbody = $('#example tbody');
    var tr = tbody.find('tr:first').clone();
    tr.find('td:first').text($(".engine").val());
    tr.find('td:eq(1)').empty();
    tr.find('td:eq(2)').empty();
    tr.find('td:eq(3)').text($(".version").val());
    tr.find('td:eq(4)').empty();
    tr.appendTo(tbody);
});

Upvotes: 0

Views: 1175

Answers (1)

Michał Rybak
Michał Rybak

Reputation: 8706

There are good examples on how to use fnAddData in the API docs.

I have rewritten your JS according to example provided in docs. I've extracted checkboxes checking into separate function to mantain high readability. The updated fiddle is here.

Upvotes: 1

Related Questions