JQuery可排序製作表格行固定

我有一個可通過jquery.sortable（）函數進行排序的表。目前，表格中的所有行都是可排序的，其中的rownumber存儲在該行的隱藏元素中，並在行移動時更新。JQuery可排序製作表格行固定

問題是我現在有一些表格需要排序的前半部分是可排序的，但下半部分需要修復。除了將它們分成兩個單獨的表之外，是否還有其他解決方案？

我有以下HTML：

<table cellspacing="0" cellpadding="5px" class="content" id="sort"> 
    <thead> 
    <tr> 
     <td>ID</td> 
     <td>Title</td> 
     <td>Created By</td> 
     <td>Last Modified By</td> 
     <td>Visiblity</td> 
     <td>Edit</td> 
     <td>Copy</td> 
     <td>Delete</td> 
     <td>Display Order</td> 
    </tr> 
    </thead> 
    <tbody class="ui-sortable"> 
    <tr class="contentbody"> 
    <td>1</td> 
    <td>content</td> 
    <td>content</td> 
    <td>content</td> 
    <td>content</td> 
    <td>content</td> 
    <td>content</td> 
    <td>content</td> 
    <td>content</td> 
    <input type="hidden" class="order" id="order_1" name="order_1" value="1"> 
    </tr> 
    <tr> 
    More Content 
    </tr> 
</tbody> 
</table>

，我有以下的JQuery在文檔準備功能：

/* table sorting */ 
    var fixHelper = function(e, ui) { 
     ui.children().each(function() { 
      $(this).width($(this).width());     
     }); 
     return ui; 
    }; 
    var sortable = $("#sort tbody").sortable({ 
     helper: fixHelper, 
     stop: function(event, ui) { 
     //create an array with the new order 
     order = {} 
     $(this).find('input.order').map(function(index, obj) 
      { 
      return order[this.id] = index; 
      } 
     ); 
     $.ajax({ 
      type: 'POST', 
      url: location.href, 
      data: order, 
      error: function() { 
       console.log("Theres an error with AJAX sorting"); 
      }, 
      success: function() { 
       /* reload table after sort*/ 
      $.get("indexpage_table.php", function(data) { 
        $("#sort tbody").html(data); 
      }); 
       console.log("Saved.");  
      } 
     }); 
     return true; 
    } 
    });

來源

2012-10-03 Michelle

分裂表格有什麼不對？你可以將它們分成兩個表格，讓它們看起來像一個。 – Dementic

我需要將列標題移動到php中，因爲我正在動態加載內容，所以在加載on（）函數後引用tbody中的任何內容。我想我可以修改sortable函數來看起來像這樣： 'var sortable = $（「＃sort」）。on（live（），'tbody'，。sortable（{...' 但是我會如果我不必這樣做，我更喜歡不必試驗 – Michelle

我添加了一個類，我想成爲可移動的，像這樣的行： var sortable = $("#sort tbody .moveable").sortable({ ...

而且我只添加隱藏的輸入字段並將光標移動到具有該類的行。

它似乎工作到目前爲止！

來源

2012-10-03 16:54:45 Michelle

JQuery可排序製作表格行固定

回答

相關問題