2015-01-11 1 views
0

Julery UI 드래그 게이블을 ul에서 table로 변환하려고했지만 실패했습니다. 다음은 Jquery UI 링크 http://jqueryui.com/sortable/#connect-lists입니다. 여기 여기 Jquery UI를 ul 대신 테이블로 정렬

<!doctype html> 
<html lang="en"> 
<head> 
    <meta charset="utf-8"> 
    <title>jQuery UI Sortable - Connect lists</title> 
    <link rel="stylesheet" href="//code.jquery.com/ui/1.11.2/themes/smoothness/jquery-ui.css"> 
    <script src="//code.jquery.com/jquery-1.10.2.js"></script> 
    <script src="//code.jquery.com/ui/1.11.2/jquery-ui.js"></script> 
    <link rel="stylesheet" href="/resources/demos/style.css"> 
    <style> 
    table td { 
     padding: 10px; 
    } 
    </style> 
    <script> 
    $(function() { 
    $(".sortable").sortable({ 
     //connectWith: ".sortable" 
    }).disableSelection(); 
    }); 
    </script> 
</head> 
<body> 
<table border="1"> 
    <tr> 
    <th>Name</th> 
    <th>Task1</th> 
    <th>Task2</th> 
    </tr> 
<tr> 
    <td> 
    <span class="ui-state-default sortable">Item 11</span> 
    <span class="ui-state-default sortable">Item 12</span> 
    <span class="ui-state-default sortable">Item 13</span> 
    </td> 
    <td> 
    <span class="ui-state-default sortable">Item 11</span> 
    <span class="ui-state-default sortable">Item 12</span> 
    </td> 
    <td> 
    <span class="ui-state-default sortable">Item 21</span>  
    </td> 
</tr> 
<tr> 
    <td> 
    <span class="ui-state-default sortable">Item 31</span> 
    <span class="ui-state-default sortable">Item 32</span> 
    </td> 
    <td> 
    <span class="ui-state-default sortable">Item 41</span>  
    </td> 
    <td> 
    <span class="ui-state-default sortable">Item 51</span> 
    <span class="ui-state-default sortable">Item 52</span> 
    <span class="ui-state-default sortable">Item 53</span> 
    </td> 
</tr> 

    </table> 
</body> 
</html> 

는 JsBin 링크 http://jsbin.com/fucasipaje/1/ 그러나 드래그 앤 드롭이 작동하지, 내가 너무 빨리 시도한 것입니다.

답변

1

$(function() { 
    $("#table td").sortable({ 
     connectWith: "#table td" 
    }).disableSelection(); 
    }); 

Example

시도
관련 문제