数据表；添加图标以选择行答案

【问题标题】：DataTable; adding icon to select rows数据表；添加图标以选择行
【发布时间】：2014-09-04 22:19:41
【问题描述】：

我想在文本左侧添加图像的行中有特定的列。这个人 (jQuery DataTables add country icons each column) 也有同样的问题。他想在单元格内的文本左侧添加标志图标；我想做基本相同的事情（但没有标志图标）。如果每一列都有一张图片，我会在表格中创建另一行，但有些列不应该有图标，所以在这种情况下这不是一个真正的选择。

到目前为止，在我的数据表选项中，我正在执行以下操作：

  options = {
    "createdRow": function(row, data, index){
      var sharedArray = scope.$eval(attrs.sharedData);
      var rowValue = data[1] + "_" + data[0];
      if ($.inArray(rowValue, sharedArray) != -1){
        $('td', row).eq(0).addClass('shared');
      }
    }

此时我最初想使用 css 将背景图像添加到 .shared 元素，但我遇到了两个问题，其中最重要的是，如果背景图像是什么，则无法在悬停时添加事件设置图标。

然后我尝试在行之前创建一个跨度

$(row).prepend('<span class="shared-icon"></span>');

希望随后将背景图像和悬停事件添加到跨度，但在 TR 中添加它会导致行及其各自标题的巨大间距问题。

我想我错过了一些相对简单的东西，但现在已经被卡住了几个小时，正在使用不同的数据表功能。想法？

【问题讨论】：

我已经努力通过文字来理解这个问题，但是这个问题的标题似乎并不能反映真正的问题。对我来说，这似乎更像是一个 CSS 问题，因为您似乎已经知道如何将特定图标添加到所需的行中。
也许；我会继续搜索的途径，谢谢！但是，这个 (editor.datatables.net/examples/inline-editing/editIcon.html) 和这个 (datatables.net/reference/option/columns.render) 让我觉得我可能缺少一个 dataTable 解决方案；也和他们一起玩。
columns.render 在这种情况下可能会很有帮助。我经常使用它，因为它允许我动态地将列数据与 html 混合。我会说它与 createdRow 回调函数非常相似。

标签： jquery datatables

【解决方案1】：

如何使用 fnCreatedCell 选项

例子

"fnCreatedCell": function (nTd, sData, oData, iRow, iCol){
  var sharedArray = scope.$eval(attrs.sharedData);
  var rowValue = oData[1] + "_" + oData[0];
  if ($.inArray(rowValue, sharedArray) != -1){
    $(nTd).addClass('shared');
  }
}

nTd 是单元格，sData 是单元格数据，oData 是行数据，iRow 是行索引，iCol 是列索引。

【讨论】：

【解决方案2】：

我不知道为什么我的大脑以前没有工作过；我今天解决了这个问题，十分钟内我就解决了这个问题。

    "createdRow": function(row, data, index){
      var sharedArray = scope.$eval(attrs.sharedData);
      var rowValue = data[1] + "_" + data[0];
      if ($.inArray(rowValue, sharedArray) != -1){
        var data = $('td', row).eq(0).html();
        $('td', row).eq(0).html("<span class='glyphicon glyphicon-asterisk'></span>" + data);
      + data }

【讨论】：