jQuery: get parent tr for selected radio button

Question

I have the following HTML:

<table id="MwDataList" class="data" width="100%" cellspacing="10px">     ....      <td class="centerText" style="height: 56px;">         <input id="selectRadioButton" type="radio" name="selectRadioGroup">     </td>      .... </table> 

In other words I have a table with few rows, in each row in the last cell I have a radio button.
How can I get parent row for selected radio button?

What I have tried:

function getSelectedRowGuid() {     var row = $("#MwDataList > input:radio[@name=selectRadioGroup]:checked :parent tr");     var guid = GetRowGuid(row);     return guid; } 

But it seems like this selector is incorrect.

Answer 1

Try this.

You don't need to prefix attribute name by @ in jQuery selector. Use closest() method to get the closest parent element matching the selector.

$("#MwDataList input[name=selectRadioGroup]:checked").closest('tr'); 

You can simplify your method like this

function getSelectedRowGuid() {     return GetRowGuid(       $("#MwDataList > input:radio[@name=selectRadioGroup]:checked :parent tr")); } 

closest() - Gets the first element that matches the selector, beginning at the current element and progressing up through the DOM tree.

As a side note, the ids of the elements should be unique on the page so try to avoid having same ids for radio buttons which I can see in your markup. If you are not going to use the ids then just remove it from the markup.