Question

我正在尝试使用JQuery UI交换表行。它工作得很好但我在拖放事件期间无法得到行号。我需要知道以下工作的行号，有人可以帮助我吗？

例如

System.out.println("Just Cycling Caps provides three types of caps: Small caps – ID: 1 Price: $4.50, Medium caps – ID: 2 Price: $7.00, and Large caps – ID: 3 Price: $9.00");
continueOrder = "y";
//While loop to get items ordered
while(continueOrder == "y"){
  //get desired cap size and quantity
  System.out.println("Enter the ID of the item you would like");
  capSize = reader.nextInt();
  if(capSize == 1){
    price = 4.5;
    System.out.println("How many small caps would you like?");
    quantityOfSmall = reader.nextInt();
    priceOfSmall = quantityOfSmall * price;
  }
  else if(capSize == 2){
    price = 7.0;
    System.out.println("How many medium caps would you like?");
    quantityOfMedium = reader.nextInt();
    priceOfMedium = quantityOfMedium * price;
  }
  else if(capSize == 3){
    price = 9.0;
    System.out.println("How many large caps would you like?");
    quantityOfLarge = reader.nextInt();
    priceOfLarge = quantityOfLarge * price;
  }
  //Ask the user if they would like to continue ordering
  System.out.println("Would you like to purchase another product? (y/n)");
  continueOrder = reader.next();
  continueOrder = continueOrder.toLowerCase();
}

事实上，我不需要对表行进行排序（只需交换），如果有任何可能的解决方案，请告诉我......

Answer 1

使用停止事件，您可以获得可拖动行的行数。

 stop: function(ui, event){
        var id = event.item.index();
        alert(id);
    }

试试这个

的jsfiddle：

http://jsfiddle.net/Vn5SZ/31/

Answer 2

将tr元素包裹在tbody内拖动tr时添加辅助克隆。只有你可以进行拖动。

当拖动开始时，会生成一个克隆（因为帮助程序：“clone”），c variable将保留对克隆的引用并拖动tr。当拖动停止时，如果它在droppable之外，则克隆将被销毁。如果它在draggable中，我们会破坏克隆和tr（因此它会从列表中删除而不能再拖动）

Answer 3

首先，不需要在开始和停止时获取行号，因为它将是相同的。

并知道行号只是为您的行提供数据属性：

data-rownumber=1

而不是试试这个

$('#table1 tbody').sortable({
revert: true,

stop: function(event, ui) {
    var row=ui.draggable.attr('data-rownumber'); 
//this will be the dragged row id
}});

如何拖放表行以使用JavaScript交换它们？

3 个答案:

的jsfiddle：