用户界面 - jQuery UI 可排序列宽在拖动行时减小

Question

你能帮忙解决这个问题吗？在这里找到小提琴代码：

jsfiddle.net/srikanthsvr82/mZc7V/4

正在发生的事情是，当我拖动一行时，拖动的行是全宽的并且看起来不错，但其他行缩小/列宽减小。我一直在尝试所有选项，如您在注释代码中看到的那样，但没有一个有效：

/*
start: function(event, ui){
  ui.placeholder.width(ui.item.width()).height(ui.item.height());
},
helper: function(e, tr){
  tr.children().each(function() {
    $(this).width($(this).width());
  });
  return tr;
  $("td").each(function () {
    $(this).css("width", $(this).width());
  });
  var $originals = tr.children();
  var $helper = tr.clone();
  $(tr.parent()).find('tr').each(function(index){
    $('td', this).each(function(index){
      $(this).css('width', $helper.eq(index).width());
    });
  });
  $helper.children().each(function(index){
    //Set helper cell sizes to match the original sizes
    $(this).width($originals.eq(index).width());
  });
  return $helper;
}
*/

任何人都可以提出解决方案。

Answer 1

我不能声称完全理解这个插件是如何工作的，但是对"helper"参数的以下更改解决了这个问题：

        helper: function(e, tr)
        {
            var myHelper = [];
            myHelper.push('<div style="width:10px;"><table>');
            myHelper.push($(tr).html());
            myHelper.push('</table></div>');                    
            return myHelper.join('');                   
        },

基本上，将帮助程序包装在与表的第一列宽度相同的容器中。