从第二列开始填充数据表

Question

我有一个从 api 检索 json 数据的数据表。表格的第一列应该只包含一个复选框。但是，在检索数据时，它也会填充第一列。

$.getJSON('https://api.myjson.com/bins/o44x', function(json) {
      $('#parametrictable').DataTable({
      data : json.data,
      columns : json.columns,

      columnDefs: [ {
        orderable: false,
        className: 'select-checkbox',
        targets:   0
    } ],
    select: {
        style:    'os',
        selector: 'td:first-child'
    },
    order: [[ 1, 'asc' ]]
   })
 }); 

有什么方法可以设置数据只从第二列开始填充，而第一列只包含复选框？

Answer 1

您可以通过更新 api 或在您的 js 代码中解决此问题，只需将 json.columns 数组中的第一个对象的 data 键值更新为 null，例如：

$.getJSON('https://api.myjson.com/bins/o44x', function(json) {
   json.columns[0].data = null;
   json.columns[0].defaultContent = '';

   $('#parametrictable').DataTable({
      data: json.data,
      columns: json.columns,
      .... your rest of code
   })
});

编辑：

我的意思是你的建议只是隐藏与复选框重叠的数据。我不想把它隐藏起来。我希望第一列默认情况下只有复选框。重叠的数据应该在第二列。

您可以像这样更新您的 API 来实现：

"columns": [
   {
      "data": null,
      "defaultContent": ""
   },
   {
      "data": "DT_RowId",
      "title": "Id"
   },
   {
      "data": "supplier",
      "title": "supplier"
   },
   {
      "data": "color",
      "title": "color"
   }
],

或者，您可以在不修改 API 的情况下更新代码，例如：

$.getJSON('https://api.myjson.com/bins/o44x', function(json) {

   // Add object for checkbox at first position
   json.columns.unshift({"data": null, "defaultContent": ""});

   $('#parametrictable').DataTable({
      data: json.data,
      columns: json.columns,
      ....your rest of code
   })
});