2010-07-20 3 views
1

두 번째 테이블에 FIRST 및 SECOND ID가 있습니다. 내가 링크 추가를 클릭하면JQuery 다른 테이블에서 행 테이블 삭제

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

내 목표는, 행은 표 1과 표 2의 순서, 링크를 삭제 될 표와 링크를 추가하는 표 2에서 이동합니다. table1에서 Delete link를 클릭하면 행이 table1에서 table 2로 이동하고 table1과 table2를 다시 정렬합니다.

어떻게 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/

관련 문제