Question

<script type="text/javascript">
    function fn_CloneRow(pThis) {
        $(pThis).parent().parent().clone().appendTo($(pThis).parent().parent().parent());
    }

With the use of above code I am able to clone clicked rows in a tabular form to the bottom of the table, but I am unable store them. When I change values of cloned rows, the original row is updated instead of adding a new row when the page is submitted.

Was it helpful?

Solution

That is because in cloning the row you also clone the element containing the primary key. From the top of my head, do this with the following elements:

  • empty the input element containing the PK (you'll need to find out if this is array f01 or any other. Your question does not provide context) or if you use rowid, clean out the input element with name "frowid"
  • empty the input element containing the row checksum. This is an input element with name "fcs"
  • set the input element containing the record status (name = fcud) to 'C' . It is used to determine what action to perform on it. 'D' is new, 'C' is changed and 'U' is update - I presume. This is not in any documentation though, it is by inspecting the html and javascript you can find this.

You can further improve your code by not doing parent().parent()... and instead simply look up the closest tr or table by using .closest(...)

var newRow = $(pThis).closest('tr').clone();
$('input[name=f01]', newRow).val(""); //input with PK value -- make sure this matches your situation!!!
$('input[name=frowid]', newRow).val(""); //or if the form works with rowid, use this
$('input[name=fcs]', newRow).val(""); //clear the checksum
$('input[name=fcud]', newRow).val("C"); //set the record status
newRow.appendTo($(pThis).closest('table')); //finally, append the row to the table
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top