Copy (Clone) Table Row to another Table using jQuery

Last Reply 4 months ago By pandeyism

Posted 4 months ago

this is my data which is come in ID

var id=table.rows[parseInt(index)].cells[0].innerHTML; alert(id); 

this is coming data...below 

<img alt="" style="cursor: pointer" src="../images/plus.png">
<div id="dvOrders" style="display: none">
<table class="secondtable">
<tbody><tr><th>S.No</th><th>S.ID</th><th>tid</th><th>topic name</th><th>video url</th><th>Notes url</th><th>tdesc</th><th>assignid</th><th>assign name</th><th>free</th></tr>
<tr><td></td><td>3</td><td>8</td><td>Hello NEW</td><td></td><td></td><td></td><td>1</td><td>Assignment-1</td><td>True</td></tr>
</tbody>
</table>
</div>

i want this so what i do that i got this below 

<table class="secondtable"><tbody><tr><th>S.No</th><th>S.ID</th><th>tid</th><th>topic name</th><th>video url</th><th>Notes url</th><th>tdesc</th><th>assignid</th><th>assign name</th><th>free</th></tr>
<tr><td></td><td>3</td><td>8</td><td>Hello NEW</td><td></td><td></td><td></td><td>1</td><td>Assignment-1</td><td>True</td></tr>
</tbody>
</table>

and this table record appent to other table 'main'

<table id=main><th><th>.....</table>
Posted 4 months ago

Hi SajidHussa,

Refer below sample code.

HTML

<div>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <script type="text/javascript">
        $(function () {
            $('#btnTransfer').on('click', function () {
                var tr = $("#dvOrders").find("Table").find("TR:has(td)").clone();
                $("#main").append(tr);
            });
        });
    </script>
    <img alt="" style="cursor: pointer" src="../images/plus.png"><div id="dvOrders">
        <table class="secondtable">
            <tbody>
                <tr>
                    <th>
                        S.No
                    </th>
                    <th>
                        S.ID
                    </th>
                    <th>
                        tid
                    </th>
                    <th>
                        topic name
                    </th>
                    <th>
                        video url
                    </th>
                    <th>
                        Notes url
                    </th>
                    <th>
                        tdesc
                    </th>
                    <th>
                        assignid
                    </th>
                    <th>
                        assign name
                    </th>
                    <th>
                        free
                    </th>
                </tr>
                <tr>
                    <td>
                    </td>
                    <td>
                        3
                    </td>
                    <td>
                        8
                    </td>
                    <td>
                        Hello NEW
                    </td>
                    <td>
                    </td>
                    <td>
                    </td>
                    <td>
                    </td>
                    <td>
                        1
                    </td>
                    <td>
                        Assignment-1
                    </td>
                    <td>
                        True
                    </td>
                </tr>
            </tbody>
        </table>
    </div>
    <br />
    <input type="button" value="Copy" id="btnTransfer" />
    <table id="main">
        <tr>
            <th>
                S.No
            </th>
            <th>
                S.ID
            </th>
            <th>
                tid
            </th>
            <th>
                topic name
            </th>
            <th>
                video url
            </th>
            <th>
                Notes url
            </th>
            <th>
                tdesc
            </th>
            <th>
                assignid
            </th>
            <th>
                assign name
            </th>
            <th>
                free
            </th>
        </tr>
    </table>
</div>

Demo