This example demonstrates how trivial it is to add a new row to the table. You can pass in options designating a class for the new row, the key, cell values, whether it should inherit these values, and the table the row should be added to.
Using a unique KEY for the new row (0 by default) will allow your data source updater to ADD vs. UPDATE the row. The datasource updater is likely an ajax submit defined in your FUNC_UPDATE.
First Name | Last Name | Age | Chicago | ";
echo ($col == 0) ?
' '.$line[$col].' ' : $line[$col]; echo " | \n";
}
echo "\t\t\n";
}
fclose($handle);
?>
|
---|---|---|---|---|---|
2020 |
Iam | FormMan |
<script type="text/javascript"> $().ready(function() { $("#editableTable").tableSorter({ sortClassAsc: 'ASC', // class name for ascending sorting action to header sortClassDesc: 'DESC', // class name for descending sorting action to header headerClass: 'header', // class name for headers (th's) disableHeader: 0 }).tableEditor({ SAVE_HTML: '', EDIT_HTML: '', EVENT_LINK_SELECTOR: 'button.edit', COL_APPLYCLASS: true, ROW_KEY_SELECTOR: 'p.key', FUNC_POST_EDIT: 'postEdit' }); $('#addNew').click(function() { var options = { CLASS: 'newRow', VALUES: { email: 'auto@populated.com', chicago: 'bearsch' } }; jQuery.tableEditor.lib.appendRow(options); }); $('#addCopy').click(function() { var options = { KEY: -1, COPY: true }; jQuery.tableEditor.lib.appendRow(options); }); }); // inject validation function postEdit(o) { var inputSelector = 'input.pvV'; var submitSelector = '../td button.edit' PommoValidate.reset(); PommoValidate.init(inputSelector, submitSelector, true, o.row); } </script>