Question

我正在尝试使用jquery sortable，当项目被移动时，它会更新隐藏的排序字段？有没有人这样做过？我尝试了一些不同的东西，但它没有通过该项目的当前顺序。

这是我的代码：

jQuery(document).ready(function() { 
  jQuery(".sortable").sortable({ 
    opacity: 0.6, 
    cursor: 'move',
    update: function(event, ui) {
      var ordering = $(this).sortable('toArray').toString();
      alert(ordering);
    }
  });
});

这是我桌子的可分类部分：

<tbody class="sortable ui-sortable">
  <tr>
    <td width="5" align="center" class="cols sort">&nbsp;</td>
    <td align="left"><a onclick="getUsrInfo(1)" class="__productTBLink"><strong>Leanne Seawright</strong>, Web Designer <span class="__rowShowInfo">- view info.</span></a></td>
    <td width="20" align="center"><a class="__productTBLink" onclick="javascript:confdelete(1);"><img width="16" height="16" align="left" title="Delete - click to delete this user" alt="Edit" src="/templates/manufacturers/images/delete.png"></a><input type="text" value="1" id="ordering[1]" name="ordering"></td>
  </tr>
  <tr>
    <td width="5" align="center" class="cols sort">&nbsp;</td>
    <td align="left"><a onclick="getUsrInfo(2)" class="__productTBLink"><strong>George Jetson</strong>, Driver <span class="__rowShowInfo">- view info.</span></a><input type="text" value="2" id="ordering[2]" name="ordering"></td>
    <td width="20" align="center"><a class="__productTBLink" onclick="javascript:confdelete(2);"><img width="16" height="16" align="left" title="Delete - click to delete this user" alt="Edit" src="/templates/manufacturers/images/delete.png"></a></td>
  </tr>
</tbody>

我只想在使用jquery sortable移动项目时更新输入字段“ordering”。

提前致谢：）

Answer 1

你应该给你的tr。的id。这是jsfiddle

<tbody class="sortable ui-sortable">
  <tr id="1">
    <td width="5" align="center" class="cols sort">&nbsp;</td>
    <td align="left"><a onclick="getUsrInfo(1)" class="__productTBLink"><strong>Leanne Seawright</strong>, Web Designer <span class="__rowShowInfo">- view info.</span></a></td>
    <td width="20" align="center"><a class="__productTBLink" onclick="javascript:confdelete(1);"><img width="16" height="16" align="left" title="Delete - click to delete this user" alt="Edit" src="/templates/manufacturers/images/delete.png"></a><input type="text" value="1" id="ordering[1]" name="ordering"></td>
  </tr>
  <tr id="2">
    <td width="5" align="center" class="cols sort">&nbsp;</td>
    <td align="left"><a onclick="getUsrInfo(2)" class="__productTBLink"><strong>George Jetson</strong>, Driver <span class="__rowShowInfo">- view info.</span></a><input type="text" value="2" id="ordering[2]" name="ordering"></td>
    <td width="20" align="center"><a class="__productTBLink" onclick="javascript:confdelete(2);"><img width="16" height="16" align="left" title="Delete - click to delete this user" alt="Edit" src="/templates/manufacturers/images/delete.png"></a></td>
  </tr>
</tbody>

jquery可排序，更新排序字段

1 个答案: