Найти индекс таблицы строк с помощью jQuery

Я являюсь промежуточным пользователем jQuery. Я знаю, чтобы найти rowIndex таблицы, используя jquery, но мой сценарий отличается. Моя таблица (GridView) состоит из 20 столбцов и каждого столбца с различными элементами управления, такими как текстовое поле, выпадающий список, изображение, ярлык. Все элементы управления на стороне сервера в каждой строке. Я связываю gridview с записями из базы данных. Теперь, когда я нажимаю на любой элемент управления или заменяет любое текстовое поле, мне нужно получить rowIndex этой измененной строки столбца. Вот код, который у меня есть:

$("#gv1 tr input[name $= 'txtName']").live('click', function(e){
   alert($(this).closest('td').parent().attr('sectionRowIndex'));
});

Но я не могу получить rowIndex. Если я использую любой элемент управления html внутри gridview, я могу получить rowIndex. Есть ли способ узнать rowIndex, когда щелкнут серверный контроль внутри gridview?

Ответ 1

Попробуйте следующее:

var rowIndex = $(this)
    .closest('tr') // Get the closest tr parent element
    .prevAll() // Find all sibling elements in front of it
    .length; // Get their count

Ответ 2

sectionRowIndex является свойством элемента <tr>, а не атрибутом.

Правильный способ изменить код примера - получить доступ к элементу jQuery с нулевым индексом, например:

$("#gv1 tr input[name $= 'txtName']").live('click', function(e){
   alert($(this).closest('td').parent()[0].sectionRowIndex);
});

Это вернет правильный индекс строки для вас. Кроме того, если вы собираетесь использовать функцию jQuery .closest() для перемещения DOM, а также .parent(), почему бы не составить эти два и просто переместиться к ближайшему элементу <tr>?

$("#gv1 tr input[name $= 'txtName']").live('click', function(e){
   alert($(this).closest('tr')[0].sectionRowIndex);
});

Это также будет обрабатывать странные случаи, когда родительские → дочерние отношения - это не то, что вы ожидали. Например, если вы привязали $(this).parent().parent(), а затем решили обернуть свою внутреннюю ячейку другим div или span, вы можете испортить отношения. .closest() - это простой способ убедиться, что он всегда будет работать.

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

Ответ 3

Это флажок в ячейке таблицы при изменении:

 var row = $(this).parent().parent();
 var rowIndex = $(row[0].rowIndex);
 console.log(rowIndex);

Ответ 4

Должен иметь возможность использовать только:

var rowIndex = $(this).parents("tr:first")[0].rowIndex;