Generate Unique Name and ID based on table's first row

The code below will generate unique name and id based on table's first row, paste it before </body>

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

Let's say for example you have this line of code in HTML:
<table id="matt">
    <tbody>
<tr>
        <td><input id="txtTitle" name="txtTitle" type="text" value="title" /></td>
        <td><input id="txtLink" name="txtLink" type="text" value="link" /></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>
</tbody>
</table>

As the form loads, the 2nd row and 3rd row "input" tag will have a name and id elements with unique names. Here's the demo showing it.


Configuration:

If you want to be more specific, use the ID of the table. Just change this line:
var rows = $("table tbody tr")
to
var rows = $("table#YOURTABLEIDHERE tbody tr")
and the 'input' on the code is your target in which the name and id will be generated.

Popular posts from this blog

Creating heat map using GeoDjango

I Am Getting Married!

Dear Girlfriend