Get table id by click in td using jQuery

Question

I have a tr in a table header that contains several input fields.

Is there a way that by click on one of these input fields I can get the id of the parent table ?

My tr looks like this:

<table id="tableID">
    <thead>
        <tr>
            <th><input type="text" name="input1" id="input1" /></th>
            <th><input type="text" name="input2" id="input2" /></th>
            <th><input type="text" name="input3" id="input3" /></th>
        </tr>
    </thead>
    <tbody>
        // ...
    </tbody>
</table>

you can use $(this).parents('table').attr('id'); – Meer Oct 23 '14 at 13:50 — Meer, Oct 23 '14 at 13:50

score 39 · Accepted Answer · answered Nov 24 '13 at 14:58

39

In the click handler you can use .closest()

$(this).closest('table').attr('id')

answered Nov 24 '13 at 14:58

Arun P Johny

384,651
66
527
531

@Arun P Johny Very fast particularly Jquery!! – Krish R Nov 24 '13 at 14:59
Closest was exactly what I missed here. This is perfect - thanks a lot for the fast reply ! – user2571510 Nov 24 '13 at 15:20

score 2 · Answer 2 · answered Nov 24 '13 at 15:05

2

$("#tableID").on("click","input[type='text']",function(){

$(this).closest('table').attr('id');

});

reference closest()

answered Nov 24 '13 at 15:05

Rituraj ratan

10,260
8
34
55

score 1 · Answer 3 · answered Nov 24 '13 at 15:04

1

You should delegate event to avoid multiple handlers, and then use delegateTarget to target current TABLE:

$('table').on('click', 'input', function (e) {
    alert(e.delegateTarget.id);
});

answered Nov 24 '13 at 15:04

A. Wolff

74,033
9
94
155

score 1 · Answer 4 · answered Oct 23 '14 at 13:52

1

You can use

$('#tdId').click(function(){
    $(this).parents('table').attr('id');
});

it works.

answered Oct 23 '14 at 13:52

Meer

1,006
10
15

Get table id by click in td using jQuery

4 Answers4

Linked