Подтвердить что ты не робот

Jquery get parent tr для выбранного переключателя

У меня есть следующий html

<table id="MwDataList" class="data" width="100%" cellspacing="10px">
      ....

<td class="centerText" style="height: 56px; ">
    <input id="selectRadioButton" type="radio" name="selectRadioGroup"></td>

Другими словами, у меня есть таблица с несколькими строками, в каждой строке последней ячейки у меня есть радиобуй. Как получить родительскую строку для выбранного переключателя?

Что я пробовал:

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

Но похоже, что этот селектор неверен.

4b9b3361

Ответ 1

Попробуйте это.

Вам не нужно указывать имя атрибута с помощью @ в селекторе jQuery. Используйте метод closest(), чтобы получить ближайший родительский элемент, соответствующий селектору.

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

Вы можете упростить свой метод следующим образом

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

closest() - Получает первый элемент, который соответствует селектору, начиная с текущего элемента и прогрессируя через дерево DOM.

Как сторона примечания, идентификаторы элементов должны быть уникальными на странице, поэтому старайтесь избегать одинаковых идентификаторов для переключателей, которые я вижу в вашей разметке. Если вы не собираетесь использовать идентификаторы, просто удалите их из разметки.

Ответ 2

Ответ

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

Как найти ближайшую строку?

Использование .closest():

var $row = $(this).closest("tr");

Использование .parent():

Проверьте этот метод .parent(). Это альтернатива .prev() и .next().

var $row = $(this).parent()             // Moves up from <button> to <td>
                  .parent();            // Moves up from <td> to <tr>

Получить всю ячейку таблицы <td>

var $row = $(this).closest("tr"),       // Finds the closest row <tr> 
    $tds = $row.find("td");             // Finds all children <td> elements

$.each($tds, function() {               // Visits every single <td> element
    console.log($(this).text());        // Prints out the text within the <td>
});

ПРОСМОТР ДЕМО


Получить только конкретный <td>

var $row = $(this).closest("tr"),        // Finds the closest row <tr> 
    $tds = $row.find("td:nth-child(2)"); // Finds the 2nd <td> element

$.each($tds, function() {                // Visits every single <td> element
    console.log($(this).text());         // Prints out the text within the <td>
});

ПРОСМОТР ДЕМО


Полезные методы

  • .closest() - получить первый элемент, соответствующий селектору
  • .parent() - получить родительский элемент каждого элемента в текущем наборе согласованных элементов
  • .parents() - получить предков каждого элемента в текущем наборе согласованных элементов
  • .children() - получить дочерние элементы каждого элемента в наборе согласованных элементов
  • .siblings() - получить братьев и сестер каждого элемента в наборе согласованных элементов
  • .find() - получить потомки каждого элемента в текущем наборе согласованных элементов
  • .next() - получите сразу следующий родственный элемент каждого элемента в наборе согласованных элементов
  • .prev() - получить непосредственно предшествующий родственный элемент каждого элемента в наборе согласованных элементов