2010-07-20 3 views
1

У меня есть две таблицы с FIRST и SECOND id.JQuery add удалить таблицу строк из другого

<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> 

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

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

+0

+1 @womp - Мы должны видеть, что вы имеете сделано первым. – JasCav

ответ

7

Это будет делать это для вас:

$(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/

Смежные вопросы