Html JQUERY UI对除第一个单元格以外的行进行排序
我正在使用JQuery UI Sortable()库,并尝试对表行进行排序,但每行的第一个单元格除外。 这可能吗 我使用下面的代码完美地拖动行: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
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");