可拖動列與Jquery重新排序

我不知道是否可以創建一個列，當我拖動它們時重新排序。我知道有可拖動框架，但需要這樣做，只使用JavaScript，jQuery或jQueryUI，而不使用其他外部框架。請有人幫助我嗎？可拖動列與Jquery重新排序

<script src="https://code.jquery.com/ui/1.11.3/jquery-ui.min.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<table class="table table-condensed" id="myTable"> 
 
    <thead> 
 
     <tr> 
 
\t \t \t <th>Name</th> 
 
\t \t \t <th>Age</th> 
 
\t \t \t <th>Sex</th> 
 
\t \t </tr> 
 
    </thead> 
 
    <tbody> 
 
     <tr> 
 
\t \t \t <td>Peter</td> 
 
\t \t \t <td>22</td> 
 
\t \t \t <td>Male</td> 
 
\t \t </tr> 
 
\t \t <tr> 
 
\t \t \t <td>John</td> 
 
\t \t \t <td>24</td> 
 
\t \t \t <td>Male</td> 
 
\t \t </tr> 
 
\t \t <tr> 
 
\t \t \t <td>Jane</td> 
 
\t \t \t <td>26</td> 
 
\t \t \t <td>Female</td> 
 
\t \t </tr> 
 
\t \t <tr> 
 
\t \t \t <td>Ralf</td> 
 
\t \t \t <td>24</td> 
 
\t \t \t <td>Male</td> 
 
\t \t </tr> 
 
\t \t <tr> 
 
\t \t \t <td>Mary</td> 
 
\t \t \t <td>24</td> 
 
\t \t \t <td>Female</td> 
 
\t \t </tr> 
 
    </tbody> 
 
</table>

編輯：

我只是做了該行的排序，列的順序不知道如何 https://jsfiddle.net/xgagdas4/

來源

2016-09-16 GustavoZafra

正如你必須知道這是可能使用jQuery UI的可排序...你嘗試過什麼到目前爲止？ –

@RakeshGR你好，我只是使用排序方法jQueryUI做了排序，但ordanção列沒有得到。 – GustavoZafra

提供了代碼 –

您可以使用jQuery UI的排序

jquery ui sortable

$('tbody').sortable({ 
    items: ">tr", 
    appendTo: "parent", 
    opacity: 1, 
    containment: "document", 
    placeholder: "placeholder-style", 
    cursor: "move", 
    delay: 150, 
});

example jsfiddle

來源

2016-09-16 13:41:19

在這種情況下，代碼如何？請原諒我的無知：/但我不知道如何做到這一點 – GustavoZafra

我已經添加了一些jsfiddle例子，我找到並編輯了一下，請參閱編輯 –

Hi @Sebastian Krysiak我需要重新排列列而不是行：/我發現沒有使用可排序方法重排列的例子 – GustavoZafra

可拖動列與Jquery重新排序

回答

相關問題