Html JQUERY UI对除第一个单元格以外的行进行排序

Html JQUERY UI对除第一个单元格以外的行进行排序,html,jquery-ui,row,jquery-ui-sortable,Html,Jquery Ui,Row,Jquery Ui Sortable,我正在使用JQuery UI Sortable()库,并尝试对表行进行排序,但每行的第一个单元格除外。 这可能吗 我使用下面的代码完美地拖动行: var fixHelperModified = function(e, tr) { var $originals = tr.children(); var $helper = tr.clone(); $helper.children().each(function(index) { $(thi

我正在使用JQuery UI Sortable()库,并尝试对表行进行排序,但每行的第一个单元格除外。 这可能吗

我使用下面的代码完美地拖动行:

  var fixHelperModified = function(e, tr) {
      var $originals = tr.children();
      var $helper = tr.clone();
      $helper.children().each(function(index) {
          $(this).width($originals.eq(index).width())
      });
      return $helper;
  };

  $("tbody").sortable({
      helper: fixHelperModified,
  }).disableSelection();
如果可以的话,除了第一个单元格(或列),是否可以只移动行

原因是我有一个携带ID值的输入字段,但是我不希望它随行的其余部分移动或更改,我需要它保持正确的顺序

需求图:

非常感谢您的帮助

再次感谢,

我为您编写了一些代码片段,这些代码片段应该可以解决您的问题。 也有一个

HTML(示例表) 注意第一个TD上的“固定”等级:

<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.11.1/jquery-ui.min.js"></script>
<TABLE id="sortable">
    <thead></thead>
    <tbody>
        <TR id="row1">
            <TD class="fixed">Data 1</TD>
            <TD>Data 2</TD>
            <TD>Data 3</TD>
            <TD>Data 4</TD>
        </TR>
        <TR id="row2">
            <TD class="fixed">Data 1</TD>
            <TD>Data 2</TD>
            <TD>Data 3</TD>
            <TD>Data 4</TD>
        </TR>
        <TR id="row3">
            <TD class="fixed">Data 1</TD>
            <TD>Data 2</TD>
            <TD>Data 3</TD>
            <TD>Data 4</TD>
        </TR>
    </tbody>
</TABLE>

嗨,哇,非常感谢你的榜样和支持!这几乎就是我要找的,但是除了第一个移动外,我需要行中的所有单元格,除了第一个一起移动。我认为这只需要调整项或类?@AlpaxJ1 JQuery-UI.Sortable的表有一些问题,因此您将遇到问题。如果可以的话,试着列出一个列表,或者如果你想保留表,试着从表中排除第一行。Hy@ Alpxj1如果这个或任何答案已经解决了你的问题,请考虑通过点击复选标记来接受它。这向更广泛的社区表明,你已经找到了一个解决方案,并给回答者和你自己带来了一些声誉。没有义务这么做。从你的JFiddle,我如何将一组中的2个数据单元(如一行)排序?这可能吗?更新了我的第一次尝试。我不喜欢一张桌子里有两张桌子,但这似乎是解决问题的最简单方法!看看,告诉我这是否更好!
  var fixHelperModified = function (e, tr) {
      var $originals = tr.children();
      var $helper = tr.clone();
      $helper.children().each(function (index) {
          $(this).width($originals.eq(index).width())
      });
      return $helper;
  };

  $("table tr").sortable({
      helper: fixHelperModified,
      cancel: ".ui-state-disabled",
      items: "td:not(.ui-state-disabled)"
  }).disableSelection();

  $(".fixed").addClass("ui-state-disabled");