如何隐藏fuelux datagrid中的列

时间:2013-04-07 00:20:10

标签: fuelux

我正在尝试创建一个隐藏列,该列将包含该行的唯一“id”作为属性,例如“data-id”。因为我似乎无法弄清楚如何检索行后面的数据模型。我正在使用服务器端数据源。

columns: [{
  property: 'hiddencolumn',
  label: '',
  hidden: true   <-- ?????
} .. .. ],

在格式化程序中,我使用了一些占位符标记,可能是一个范围

$.each(items, function(index, item) {
  item.hiddencolumn = '<span data-id="' + item.id + '"</span>';
});

然后我在行中添加一个click处理程序,然后获取data-id列:

$('#MyGrid').on('loaded', function() {
  $('#MyGrid > tbody > tr').click(function() {
    console.log($(this).find('> td > span').attr('data-id'));
  });
});

这是对的吗?或者我应该尝试将data-id添加到tr标签/行本身?以上概念有效,但我只需要知道如何隐藏列:)

感谢

编辑4月14日 - 这就是我为解决这个问题所做的工作。使用data-id并隐藏现有列中的范围。对我来说,我的模型中有一个“日期”和“id”字段。我选择将id标记到日期字段中。

formatter: function(items) {
  $.each(items, function(index, item) {
    item.date = item.date + '<span style="visibility: hidden;" data-id="' + item.id + '"/>';
  });
}

然后像这样检索id(使用jquery)

$('#MyGrid').on('loaded', function() {
  $('#MyGrid > tbody > tr').click(function() {
    console.log($(this).find('> td > span').attr('data-id')); // value is here
  });
});

OK?

1 个答案:

答案 0 :(得分:2)

columns属性仅适用于可见列。因此,您可能希望将其删除,并在格式化程序中为您的其他(可见)列创建一个带有data-id属性的范围。如果有任何按钮或其他控件用于处理行中的项目,我通常会在最后一列中执行此操作。