Slickgrid 列重新排序无法正常工作答案

【问题标题】：Slickgrid column reordering not working correctlySlickgrid 列重新排序无法正常工作
【发布时间】：2011-10-12 18:35:41
【问题描述】：

我正在使用 Slickgrid javasript 库，并使用以下选项初始化了我的网格：

var options = 
{
  enableCellNavigation: true,
  enableColumnReorder: true,
  syncColumnCellResize: false,
  asyncEditorLoading: true
};

我已经实现了我的 slickgrid 的其余部分，它运行良好。我遇到的唯一问题是列重新排序无法正常工作。

我可以将列标题拖到另一个位置，但是当它悬停在我想要放置它的位置时，其他列标题并没有像我之前看到的示例那样移动。我通常需要弄乱列标题，直到打开一个空间。

我没有看到任何关于列标题无法重新排序的文档，所以我什至不知道在哪里，或者什么可能导致这些问题。

有没有人有任何类似的问题，例如 Slickgrid 的这些问题，或任何建议？

【问题讨论】：

标签： javascript slickgrid

【解决方案1】：

我最近才开始使用 SlickGrid，遇到了类似的问题。

我是这样做的：

var options = { ... };
var dataView = ...;

// initialize columns with empty array
var columns = [];

// intialize myGrid with the empty columns
var myGrid = new Slick.Grid(
                  "#myGrid", dataView,
                  columns, options);

// initialize columns here (e.g. after loading dynamic column header data)
columns.push(
  {id:"sel", name:"#", field:"num", sortable: true},
  {id:"title", name:"Title", field:"title", sortable: true},
  {id:"duration", name:"Duration", field:"duration", sortable: true});

// update the columns
myGrid.setColumns(columns);

你可能会问我为什么这样做。好吧，我有一些来自动态内容的列标题，并试图保持内容加载与我的行数据加载相同的方法。无论如何，当我以上述方式执行此操作时，其他所有内容（例如事件处理程序、行更新等）似乎都可以正常工作，除了您描述的奇怪的列重新排序行为。

经过反复试验并将我的代码与提供的示例进行比较后，我发现我的错误在于在初始化期间没有正确设置列。显然，当您使用空的 columns 数组调用 new Slick.Grid 时，会发生奇怪的行为。

我所做的修复它是简单地用一个虚拟的非空列数组初始化网格，然后稍后仍然调用 setColumns 来设置实际的列。例如

// intialize myGrid with dummy column array
var myGrid = new Slick.Grid(
                  "#myGrid", dataView,
                  [{id: "dummy"}], options);

在我进行这个单一更改后，其他一切都按预期工作。

我花了一点时间才弄明白，但我希望它对您或可能遇到类似问题的其他人有所帮助。

【讨论】：

非常感谢！我有同样的问题。这解决了它。很好的答案。