JQuery Clone клонирует данные последней строки

Question

Я столкнулся с проблемой. Я использую:

$(this).parents("tr:first").remove(); 

удалить строку пользователь нажал на, а затем:

var row = $('#picTableDisplay tbody>tr:last').clone(true) 
      .insertAfter('#picTableDisplay tbody>tr:last'); 

заменить новый (пустой) строки в нижней части таблицы.

Но, когда таблица заполнена (12 строк), и пользователь хочет удалить строку, , нижняя таблица (имеющая данные) клонируется (с данными).

В этом случае, как удалить щелчок по строке и добавить строку в нижнюю часть таблицы , которая пуста?

Спасибо.

Answer 1

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

1. Clone последняя невидим строка (у вас есть 13 строк), или

2. Clone строки из шаблона вы держите на стороне, например:

   $('#RowTemplate tr').clone(true).show() 
   

3. Другой вариант скопировать строку при загрузке страницы, а затем клонирование его:

   var rowTemplate = $('#picTableDisplay tbody>tr:last').clone(true) 
   
   $('#picTableDisplay tr').click(function(){ 
       $(this).closest('tr').remove(); 
       var row = rowTemplate.clone(true) //... 
   }); 
   

Обратите внимание, что есть известная ошибка с клонированием последнего элемента IE, как описано здесь: Problem using jQuery clone function in form.