after learning the difference between parents and parent, I am having
to resort to using parent(), but it's not very clean.

Consider the following table, which is embedded in a page, which may
have additional tables (for this reason I cannot use parents("table")
because it returns multiple tables):

<table class="gridview" id="A" cellpadding="0" cellspacing="0">
   <tbody>
    <tr class='gvheader'>
        <th width="20px">&nbsp;</th>
        <th width="150px">Host</th>
        <th width="100px">Directs To</th>
        <th width="40px">TTL</th>
    </tr>
    <tr class="dgalt" id="trEmptyA" runat="server" visible="false">
        <td colspan="5">You currently do not have any Records.</td>
    </tr>
    <tr class="gvfooter">
        <td colspan="4" class="newRecord">Add New Record</td>
    </tr>
   </tbody>
</table>

and now my jquery:
Notice the multiple .parent().parent().parent()
and $currentTable.children().children().size();

$(function() {
            $(".newRecord").click(function() {
                var $currentTable = $(this).parent().parent().parent
();

                var tableType = $currentTable.attr("id");
                var numRows = $currentTable.children().children().size
();
                var $templateRow = $("#EditRowTemplate").clone().attr
("id", "new"+tableType+"Record_"+numRows);

                if (tableType=='MX'){
                    $("td:nth-child(5)", $templateRow).show();
                } else {
                    $("td:nth-child(5)", $templateRow).hide();
                }


                $templateRow.insertAfter($("tr:last",
$currentTable).prev());
            });
         });


Is there a way to use parents, while only selecting the immediate
parent table? and similarily with children, is there a better way to
do this?

I cannot always assume this is the first table, there may be 3,4,5 etc
tables side-by-side.

Thanks

Reply via email to