Jquery table 移动后的行索引
Jquery table row index after move
我昨天创建了一个 来帮助我找到 <tr>
或 <li>
使用 Jquery UI
拖放功能移动后的新索引,这非常有效 :)
但是我没有想到并且今天早上一直在努力弄清楚的事情是...我如何找到 <tr>
或 <li>
的 index
正在向上或向下移动。
EG:给定下面的 table,如果我将 "email" 移动到位置 1,"other" 将移动到 2 的 index
。我将如何提醒这个值及其 RefID ?
+--------+------------------+
| Ref ID | Issue relates to |
+--------+------------------+
| 9342 | Other |
| 9392 | CRM |
| 9394 | CRM |
| 9308 | eMail |
| 9365 | CRM |
+--------+------------------+
这是我一直在玩的FIDDLE
提前谢谢你们。
麦克
编辑: 所以,我只是将它们移动了一点,如果你在我们刚刚移动的那些之上移动另一行,"Other" 现在将是在 index
3. 哎呀!!当我看着这个东西时,我变得更加复杂。
您需要使用 :eq()
选择器来仅定位必需的 tr 元素。
var RefID = $('tr').eq(Newpos).find('td:first').html();
var RefName = $('tr').eq(Newpos).find('td:eq(1)').html();
无论移动了哪一行,您总是从第一行开始 html。
由于 ui.item
是移动的 <tr>
,您可以通过在 ui.item
中查找来访问 td
var RefID = ui.item.find('td:first').html();
所以我可能没有正确表达我的问题,但我通过在移动它们之后检查所有 rows
的 index
和 RefID
设法得到了我想要的.
我的代码现在看起来像这样:
$(document).ready(function () {
$('tbody').addClass("DragMe");
$('.DragMe').sortable({
disabled: false,
axis: 'y',
items: "> tr:not(:first)",
forceHelperSize: true,
update: function (event, ui) {
var Newpos = ui.item.index();
var RefID = $('tr').find('td:first').html();
//alert("Position " + Newpos + "..... RefID: " + RefID);
$("#GridView1 tr:has(td)").each(function () {
var RefID = $(this).find("td:eq(0)").html();
var NewPosition = $("tr").index(this);
alert(RefID + " " + NewPosition);
});
}
}).disableSelection();
});
这是工作 FIDDLE
感谢您的帮助!
我昨天创建了一个 <tr>
或 <li>
使用 Jquery UI
拖放功能移动后的新索引,这非常有效 :)
但是我没有想到并且今天早上一直在努力弄清楚的事情是...我如何找到 <tr>
或 <li>
的 index
正在向上或向下移动。
EG:给定下面的 table,如果我将 "email" 移动到位置 1,"other" 将移动到 2 的 index
。我将如何提醒这个值及其 RefID ?
+--------+------------------+
| Ref ID | Issue relates to |
+--------+------------------+
| 9342 | Other |
| 9392 | CRM |
| 9394 | CRM |
| 9308 | eMail |
| 9365 | CRM |
+--------+------------------+
这是我一直在玩的FIDDLE
提前谢谢你们。
麦克
编辑: 所以,我只是将它们移动了一点,如果你在我们刚刚移动的那些之上移动另一行,"Other" 现在将是在 index
3. 哎呀!!当我看着这个东西时,我变得更加复杂。
您需要使用 :eq()
选择器来仅定位必需的 tr 元素。
var RefID = $('tr').eq(Newpos).find('td:first').html();
var RefName = $('tr').eq(Newpos).find('td:eq(1)').html();
无论移动了哪一行,您总是从第一行开始 html。
由于 ui.item
是移动的 <tr>
,您可以通过在 ui.item
td
var RefID = ui.item.find('td:first').html();
所以我可能没有正确表达我的问题,但我通过在移动它们之后检查所有 rows
的 index
和 RefID
设法得到了我想要的.
我的代码现在看起来像这样:
$(document).ready(function () {
$('tbody').addClass("DragMe");
$('.DragMe').sortable({
disabled: false,
axis: 'y',
items: "> tr:not(:first)",
forceHelperSize: true,
update: function (event, ui) {
var Newpos = ui.item.index();
var RefID = $('tr').find('td:first').html();
//alert("Position " + Newpos + "..... RefID: " + RefID);
$("#GridView1 tr:has(td)").each(function () {
var RefID = $(this).find("td:eq(0)").html();
var NewPosition = $("tr").index(this);
alert(RefID + " " + NewPosition);
});
}
}).disableSelection();
});
这是工作 FIDDLE
感谢您的帮助!