【问题标题】:SlickGrid Row ID changes after filtering过滤后 SlickGrid 行 ID 更改
【发布时间】:2012-09-19 12:44:30
【问题描述】:

我有一个带有内联过滤的 slickgrid(使用 DataView)。我为每一行数据分配了唯一的 ID,并将这个 ID(不是行号)传递给一个函数,该函数在 UI 上的其他位置更新 div。

如果我不过滤,这可以正常工作。但是,如果我在传递 ID 之前过滤列,它会更改 ID 以反映行 #。它甚至会将字符串 ID 更改为行号。

这看起来很奇怪。知道发生了什么吗???

grid_msc.onClick.subscribe(function(e, args) {
    var cell = grid_msc.getCellFromEvent(e);
    var row = cell.row;             // get row #
    var row_ID = data_msc[row].id;  // get the row ID, not row #
    var msc = data_msc[args.row][grid_msc.getColumns()[args.cell].field];

    alert("Row#:"+row+", RowID:"+row_ID+", Value:"+msc);
    mscToUI(msc, row_ID);
});


// Add the selected item to the UI
    function mscToUI(addC, cellNum) {
        alert(addC+", "+cellNum);
        $('#selectedMsc').append('<a href="javascript:removemsc('+cellNum+')" id="'+cellNum+'" class="rSel"><img src="images/remove.png" align="texttop" border="0" style="padding-right:4px;">'+addC+'<br /></a>');
    }
})

【问题讨论】:

  • 真的……没人知道这件事??这似乎是一件很常见的事情,但显然是错误的!

标签: javascript filter slickgrid


【解决方案1】:

如果您已经在使用 DataView,那么您应该从 it (dataView_msc) 而非原始数据源 (data_msc) 获取行/数据。

grid_msc.onClick.subscribe(function(e, args) {
  var cell   = grid_msc.getCellFromEvent(e);  // get the cell
  var row    = cell.row;  // get the row's index (this value will change on filter/sort)
  var item   = dataView_msc.getItem(row);  // get the row's item (see: object, data)
  var msc    = item[grid_msc.getColumns()[cell.cell].field];  // get the value of the cell

  alert("Row Index:"+row+", RowID:"+item.id+", Cell Value:"+msc);
  console.log(item);
  mscToUI(msc, item.id);
});

我不太确定您打算在 mscToUI() 内做什么,以及单击单元格的值及其行的 id 属性的值。我认为将行的整个数据对象 (item) 简单地传递给函数并使用 DataView 的查找方法执行任何其他操作可能更聪明:

  • getIdxById(id) - 有了item的id,在grid中找到相对的行索引`
  • getItem(i) - 使用过滤网格的行索引,返回所述行的数据/项目
  • getItemById(id) - 使用项目的 id,返回所述项目的数据/项目
  • getItemByIdx(i) - 使用未过滤网格的行索引,返回所述行的数据/项目

【讨论】:

  • 我认为这个答案应该被接受!顺便说一句,谢谢你的回答帮了大忙!
猜你喜欢
  • 1970-01-01
  • 2013-12-11
  • 1970-01-01
  • 1970-01-01
  • 2013-04-11
  • 2014-01-09
  • 2014-01-30
  • 1970-01-01
  • 2014-06-01
相关资源
最近更新 更多