0
<table border="1" id="matt">
<tr> 
     <td><input type="text" id="txtTitle" name="txtTitle"></td> 
     <td><input type="text" id="txtLink" name="txtLink"></td> 
</tr>
<tr> 
     <td><input type="text"></td> 
     <td><input type="text"></td> 
</tr>
<tr> 
     <td><input type="text"></td> 
     <td><input type="text"></td> 
</tr>


<script language="javascript">
var i = 1;
$(window).load(function() {
$("tbody tr:last").find("input").each(function() {
$(this).attr({
  'id': function(_, id) { return id + i },
  'name': function(_, name) { return name + i },
  'value': ''               
});
}).end().appendTo("#matt");
i++;
});
</script>

given this code.. I want to generate and copy the attributes/tag from the first row of the table as the form loads, it should be unique..any help? I'm having a hard time.

Brian Tompsett - 汤莱恩
  • 5,753
  • 72
  • 57
  • 129
Sachi Tekina
  • 1,800
  • 5
  • 28
  • 50
  • Why do you need id's on these seemingly non-unique elements? – Kevin B May 29 '13 at 14:19
  • you can ignore the id..the important is the name because i'll be using it as basis in fetching the value to save it to database.. – Sachi Tekina May 29 '13 at 14:24
  • You need to first get the name of the elements in the first row, then iterate through them all using that name. Your current code will only properly set the name of the first, the rest will be named 1-n – Kevin B May 29 '13 at 14:33
  • only one subsidiary tip: instead of the deprecated attribute language="javascript" use standard one type="text/javascript" ([info here](http://stackoverflow.com/questions/2626563/leaving-out-type-text-javascript-language-javascript#2626573)) – Stano May 29 '13 at 14:35
  • thanks for your immediate response...however, i'm not that good with this..would you mind sharing a code snippet of your idea, that will serve as my guide. – Sachi Tekina May 29 '13 at 14:38
  • What is the purpose of `:last` in your code? ( i have to understand the code to fix it. ) – Kevin B May 29 '13 at 15:08
  • the last row of the table.. – Sachi Tekina May 29 '13 at 15:13
  • It is unclear what is your aim: to add a new row at the end of the table, or only add modified attributes from the first row to each existing row? example: http://jsfiddle.net/aVpBR/ – Stano May 29 '13 at 15:14
  • 1
    Your current code takes the last row and finds its inputs, iterates over them (just the inputs in that one row) and sets their name and id to "1". That obviously isn't what you want, what do you want it to do? What did you expect that to do? – Kevin B May 29 '13 at 15:17
  • the later part..i want to add modified attributes, supposedly the first row has the name element e.g. ''..the second row should have '' – Sachi Tekina May 29 '13 at 15:19
  • Thanks to @Stano..I may able to solve this. i'll go back if i get trouble again..thanks. – Sachi Tekina May 29 '13 at 15:26

1 Answers1

0

Ok, in case you only want to copy those modified attributes from the first table row's input tags to inputs in all other rows of the table, you can use this algorithm:

$(document).ready(function () {
    var rows = $("table tbody tr");
    var txtTitle = rows.first().find('input').eq(0);
    var txtLink = rows.first().find('input').eq(1);
    rows.each(function (i) {
        if (i==0) { return; } // skip first row.
        var inputs = $(this).find('input');
        inputs.eq(0).attr('id', txtTitle.attr('id')+i )
            .attr('name', txtTitle.attr('name')+i )
            .attr('value', txtTitle.attr('value')+i );
        inputs.eq(1).attr('id', txtLink.attr('id')+i )
            .attr('name', txtLink.attr('name')+i )
            .attr('value', txtLink.attr('value')+i );
    });
});

The above code was tested here, its simplified version here.

Also cloning a row in jQuery is as simple as e.g.:

$('table#matt tbody').append($('table#matt tbody tr:first').clone());
Stano
  • 8,749
  • 6
  • 30
  • 44