Найти индекс строки таблицы с помощью 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 внутри сетки, я могу получить rowIndex. Есть ли способ узнать rowIndex при нажатии на элемент управления сервером внутри gridview?


jquery indexing row
person superachu    schedule 25.10.2009    source источник

Ответы (4)


arrow_upward
44
arrow_downward

Попробуй это:

var rowIndex = $(this)
    .closest('tr') // Get the closest tr parent element
    .prevAll() // Find all sibling elements in front of it
    .length; // Get their count
person Darin Dimitrov    schedule 25.10.2009
comment
Но я хочу получить rowIndex измененного текстового поля? - person superachu; 25.10.2009
comment
Не могли бы вы предоставить HTML-код вашей страницы? - person Darin Dimitrov; 25.10.2009
comment
‹tr› ‹td› ‹span id=gv1_ctl02_lblID›1‹/span› ‹/td› ‹td› ‹input type=text id=gv1_ctl02_txtName value=Achu name=gv1$ctl02$txtName/› ‹/td› ‹td › ‹input type=text value=Madurai id=txtLocation/› ‹/td› ‹/tr› Когда я нажимаю на gv1_ctl02_txtName, я не получаю rowIndex, но когда я нажимаю на txtLocation, я могу его получить. - person superachu; 25.10.2009
comment
В вашем селекторе "#gv1 tr input[name $= 'txtName']" вы принимаете только те входные данные, имя которых заканчивается на txtName, поэтому он должен нормально работать для текстового поля gv1$ctl02$txtName, а не для текстового поля txtLocation. - person Darin Dimitrov; 25.10.2009
comment
Нет, он предупреждает rowIndex как «0» для всех строк. Но для txtLocation он возвращает правильный индекс. txtLocation — это элемент управления HTML! - person superachu; 26.10.2009
comment
@Дарин Димитров, твой код не работает. Любая помощь? - person superachu; 27.10.2009
comment
это дает неверный rowIndex, если есть <thead> и <tbody>. попробуй $(this).closest('tr')[0].rowIndex - person Homer; 05.09.2013

arrow_upward
9
arrow_downward

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() — это простой способ убедиться, что он всегда будет работать.

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

person BenSwayne    schedule 24.11.2011

arrow_upward
4
arrow_downward

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

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

arrow_upward
2
arrow_downward

Должна быть возможность просто использовать:

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