Справка JQuery, необходимая для порядка ID, заданного N строк

Question

Я пытаюсь добавить функцию, которая, когда пользователь нажимает «удалить»,

1. обновляет числа в крайнем левом столбце
2. обновляет порядок идентификаторов
3. обновляет чередующуюся цветовую схему

Мне нужна помощь с:

1. Я могу обновить строку номера но в настоящее время он обновляется для всех строк, даже если там ничего нет. Может кто-нибудь показать мне, как это сделать только для заполненных строк? Например, остановка, когда у данной строки нет данных.

2. Что-то не так с моей логикой для обновления всех идентификаторов для данной строки. Я пытаюсь заменить номер в конце имени идентификатора (например, «numRow11») на соответствующий номер строки.

           $('#files_list tr').each(function(index) {
   
               // update number order
               $(this).find("td:first").text(index+1);    
   
              $(this).find("td").attr('id', $(this).attr('id').replace($(this).attr('id').match(/[\d\.]+/g), index));                          
   
              if (index % 2 == 0)
                $(this).removeClass().addClass('evenRow');
              else
               $(this).removeClass().addClass('oddRow');
   
   });
   

Answer 1

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

$ ('# files_list tr'). Each (function (index) { var rowblank = true;

 $(this).find("td").filter("input[type=text]").each(function() {
        if ($(this).val().length > 0) {
            rowblank = false;
            return false;
        }
 });

  if (rowblank === false) {

            // update number order
            $(this).find("td:first").text(index+1);    

           $(this).find("td").attr('id', $(this).attr('id').replace($(this).attr('id').match(/[\d\.]+/g), index));                          

           if (index % 2 == 0)
             $(this).removeClass().addClass('evenRow');
           else
            $(this).removeClass().addClass('oddRow');
      }

});

Answer 2

ОК, спасибо за ваши ответы, но в конце концов я понял, как это сделать по-другому Ключевым моментом для меня было определить, сколько строк содержит данные на основе событие нажатия addRow в библиотеке JavaScript, которую я пишу. Когда-то у меня было значение hasdata тогда все остальное было довольно просто. Я разместил это ниже на случай, если это пригодится кому-либо в будущем.

Спасибо за вашу помощь.

// current count of rows with data
                         var hasdata = element.multi_selector.count - 2;

                         $('#files_list tr').each(function(index) { 

                            // THIS REPLACES THE ROW NUMBER ORDER
                            if (index < hasdata)
                                $(this).find("td:first").text(index+1);
                            else
                                $(this).find("td:first").text("");  

                            // THIS RESETS THE ALTERNATING COLOR SCHEME
                            if (index % 2 == 0)
                                $(this).removeClass().addClass('evenRow');
                            else
                                $(this).removeClass().addClass('oddRow');          

                            // THIS UPDATES THE ID VALUES - "someid1, someid2, someid3, someid4, etc"
                            $(this).find("td").each(function(){

                               var id = $(this).attr('id');   
                               $(this).attr('id', id.replace(id.match(/[\d\.]+/g), index));

                            });

Answer 3

Стоп, когда в строке нет данных.

docs.jquery.com:

Возвращение 'false' изнутри каждой функции полностью останавливает цикл через все элементы (это похоже на использование 'break' с нормальным циклом).