JQuery добавить удалить таблицу строк из другого

Question

У меня есть две таблицы с идентификатором FIRST и SECOND.

<TABLE ID="FIRST">
<TR>
<TD></TD>
<TD></TD>
<TD></TD
</TR>
</TABLE>

<TABLE ID="SECOND"> 
<TR>
<TD>1</TD>
<TD>First Value</TD>
<TD><A HREF="#">Add</A></TD>
</TR>
<TR>
<TD>2</TD>
<TD>Second Value</TD>
<TD><A HREF="#">Add</A></TD>
</TR>
<TR>
<TD>...</TD>
<TD>...</TD>
<TD><A HREF="#">Add</A></TD>
</TR>
</TABLE>

Моя цель состоит в том, чтобы, когда я нажимаю ссылку «Добавить», строка перемещается из таблицы «Таблица2» в таблицу «1» со ссылкой «Добавить», становится ссылкой «Удалить», переупорядочивает таблицы 1 и таблицы 2.,Когда я нажимаю ссылку Удалить в таблице 1, строка перемещается из таблицы 1 в таблицу 2, изменяя порядок таблицы 1 и таблицы 2.

Как я могу реализовать ее с помощью JQuery?

Answer 1

Это сделает для вас:

$(function() {
   function moveRow(row, targetTable, newLinkText){
       $(row)
           .appendTo(targetTable)
           .find("A")
               .text(newLinkText);
   }

   $("#FIRST A").live("click", function(){
       moveRow($(this).parents("tr"), $("#SECOND"), "Add");
   });

   $("#SECOND A").live("click", function(){
       moveRow($(this).parents("tr"), $("#FIRST"), "Delete");
   });
});​

http://jsfiddle.net/UxRVa/1/

Чтобы отсортировать таблицу, используйте что-то вроде: http://tablesorter.com/docs/