Question

I created 11 tables dynamically with php, and each cell on each table contains an input textbox.

Like this:

<table>
<tr>
<td><input value="2" class="amount 1 " name="item_prices[10][000][1][1]" size="3" type="text"></td>
<td><input value="2" class="amount 2 " name="item_prices[10][000][1][2]" size="3" type="text"></td>
</tr>
<tr>
<td><input value="2" class="amount 1 " name="item_prices[10][001][1][1]" size="3" type="text"></td>
<td><input value="2" class="amount 2 " name="item_prices[10][001][1][2]" size="3" type="text"></td>
</tr>
</table>


<table>
<tr>
<td><input value="2" class="amount 1 " name="item_prices[25][000][1][1]" size="3" type="text"></td>
<td><input value="2" class="amount 2 " name="item_prices[25][000][1][2]" size="3" type="text"></td>
</tr>
<tr>
<td><input value="2" class="amount 1 " name="item_prices[25][001][1][1]" size="3" type="text"></td>
<td><input value="2" class="amount 2 " name="item_prices[25][001][1][2]" size="3" type="text"></td>
</tr>
</table>

And so on…

The only difference between the 11 tables are the input names and I’d like to copy all contents between tables, from table 1 to table 10 and from table 2 to table 6 for example.

Which is the best method to accomplish this? Using jQuery I have to walk for each input box get the value and then copy to the destination table the user selected?

Answer 1

If you can rely on all tables always have same amount and order of text boxes then this code will work:

function CopyTableInputs(sourceTableId, destinationTableId) {
    var oSource = $("#" + sourceTableId);
    var oDest = $("#" + destinationTableId);
    var arrSourceInputs = oSource.find("input");
    var arrDestInputs = oDest.find("input");
    arrDestInputs.each(function(i) {
        this.value = arrSourceInputs[i].value;
    });
});​

Live test case.

For this you’ll have to add id to each table, if you want to avoid this step and don’t have any other tables in your document you can change the function a little and use indices:

function CopyTableInputs(sourceTableIndex, destinationTableIndex) {
    var oSource = $("table").eq(sourceTableIndex);
    var oDest = $("table").eq(destinationTableIndex);
    //...same as above
});​