Selecting elements within a table with javascript/jquery

Question

I'm trying to select an id inside my table for each row.

This is my table(inspected with browser) at the moment.

<table id="sort">
            <thead>
                <tr>
                    <th></th>
                    <th></th>
                    <th></th>
                    <th>Pri </th>
                </tr>
            </thead>

                        <tbody style="cursor: n-resize; " class="ui-sortable"><tr class="priorityRow">
                            <td id="tableDragSort">
                                <a class="deleteLink" href="#" rel="17904" title="">
                                 <img src="/Content/Images/Garage/DeleteButton.png"></a>
                            </td>
                            <td>
                                <img id="MainContent_MainColContent_ImageRepeater_CarImg_0" class="17904" src="" style="height:45px;width:60px;">
                            </td>
                            <td>
                                <input name="ctl00$ctl00$MainContent$MainColContent$ImageRepeater$ctl00$txtText" type="text" value="hjjj" id="MainContent_MainColContent_ImageRepeater_txtText_0">
                            </td>
                            <td class="picturePriority">
                                1
                            </td>
                        </tr><tr class="priorityRow" style="opacity: 1; z-index: 0; ">
                            <td id="tableDragSort" style="width: 22px; ">
                                <a class="deleteLink" href="#" rel="17903" title="">
                                 <img src="/Content/Images/Garage/DeleteButton.png"></a>
                            </td>
                            <td style="width: 60px; ">
                                <img id="MainContent_MainColContent_ImageRepeater_CarImg_1" class="17903" src="" style="height:45px;width:60px;">
                            </td>
                            <td style="width: 153px; ">
                                <input name="ctl00$ctl00$MainContent$MainColContent$ImageRepeater$ctl01$txtText" type="text" value="dd" id="MainContent_MainColContent_ImageRepeater_txtText_1">
                            </td>
                            <td class="picturePriority" style="width: 21px; ">
                                2
                            </td>
                        </tr><tr class="priorityRow" style="opacity: 1; z-index: 0; ">
                            <td id="tableDragSort" style="width: 22px; ">
                                <a class="deleteLink" href="#" rel="17895" title="">
                                 <img src="/Content/Images/Garage/DeleteButton.png"></a>
                            </td>
                            <td style="width: 60px; ">
                                <img id="MainContent_MainColContent_ImageRepeater_CarImg_2" class="17895" src="" style="height:45px;width:60px;">
                            </td>
                            <td style="width: 153px; ">
                                <input name="ctl00$ctl00$MainContent$MainColContent$ImageRepeater$ctl02$txtText" type="text" value="wggw" id="MainContent_MainColContent_ImageRepeater_txtText_2">
                            </td>
                            <td class="picturePriority" style="width: 21px; ">
                                3
                            </td>
                        </tr>
                  </table>

The id which here is 17904, 17903 and 17895 in both <a rel=""> and <img class=""> is the one I want to select into my javascript method which is here:

$("#sort .priorityRow").each(function ()
    {
        var index = $(this).index() + 1;


        var id = /* SELECT ID HERE */

        console.log(id);
        $(this).find(".picturePriority span").text(index);
        SetPicturePriority(id, index);
    });
}

I don't care which way i select the id really, as long as it works.

Anyone able to help? :)

Does not seem to matter as it works on another site. But, the problem here is the selecting of the img id, not the ids on the table — sindrem
– sindrem, Commented Nov 5, 2012 at 19:16
What ID? The numbers are on the rel attribute. var id = $(this).find('a').attr('rel'); — adeneo
– adeneo, Commented Nov 5, 2012 at 19:20

I Hate Lazy · Accepted Answer · 2012-11-05 19:21:02Z

1

It sounds like maybe you're trying to do this:

$("#sort .priorityRow").each(function () {
    var rel = $(this).find("a").first().attr("rel"),
        index = this.rowIndex + 1;

    $(this).find(".picturePriority").text(index);

    SetPicturePriority(rel, index);
});

answered Nov 5, 2012 at 19:21

I Hate Lazy

49k13 gold badges89 silver badges79 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

sindrem Over a year ago

Yes! var rel = $(this).find("a").first().attr("rel") is what i wanted, thanks.

Pranay Rana · Accepted Answer · 2012-11-05 19:15:21Z

1

you can get id like this

var id =$(this).attr("id");

answered Nov 5, 2012 at 19:15

Pranay Rana

177k37 gold badges244 silver badges267 bronze badges

2 Comments

sindrem Over a year ago

i still cant figure out how i can select the rel attr on the <a> element

I Hate Lazy Over a year ago

There's no id attribute on the tr elements, but if there was, there's no real reason to use .attr() to get the id. It's much faster and simpler to just do this.id

Collectives™ on Stack Overflow

Selecting elements within a table with javascript/jquery

2 Answers 2

1 Comment

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related