时间戳

首页 > 解决方案 > 在数据表中添加新行时如何向元素（标签）添加数据属性？

javascript - 在数据表中添加新行时如何向元素（标签）添加数据属性？

问题描述

我正在使用 JavaScript 和 JavaScript 函数内部添加新行，并且我想在创建行时将属性和类名添加到行中：

var rowNode = myTable.row.add([results.location_id, location_name.value, location_streetname.value , add_loc_hotline_phone ]).draw().node();

const $rowindex_ = $(rowNode).closest("tr");

const loc_city = $rowindex_.find('.location_address').attr('data-loc_city', location_city.value);
const loc_streetname = $rowindex_.find('.location_address').attr('data-loc_streetname', location_streetname.value);

在上面你可以看到我将如何更新已经存在的属性，但我如何首先创建它们？

更新：我首先需要为每一行创建类名，因为稍后我需要按类名查找标签。那么在创建行时我应该如何给他们类名呢？

标签： javascripthtmljquerydatatable

解决方案

要将隐藏的数据信息添加到一行，可以使用data()函数：

var rowNode = myTable.row
  .add([results.location_id, location_name.value, 
        location_streetname.value, add_loc_hotline_phone])
  .data({city: location_city.value, streetname: location_streetname.value})
  .draw().node();

要添加一个类，您可以使用createdCell回调：

$('#container').dataTable( {
  // ...
  "columnDefs": [ {
    "targets": 0, // First column
    "createdCell": function (td, cellData, rowData, row, col) {
      td.classList.add(`column-id`);
    }
  } ]
} );

推荐阅读