Question

需要使用Edit＆amp; amp填充表格行删除图标。可以在每一行上获得按钮但无法获取图标。使用JSOn

填充数据表

var jsonResponse = JSON.parse(data);    
var table = $('#register-data').DataTable({
    "data": jsonResponse.data,
    "columns": [
         { "data": "ReleaseID" },
         { "data": "ReleaseName" },
         {
           "data":null,      
           "defaultContent": "<button class='btn-Edit'><i class="fa fa-edit"></i>Edit</button>"
         },               
     ],                            
     "order": [[1, 'dsc']]                       
});

在index.html文件中调用了字体awesome

任何建议都会很棒

Answer 1

您遇到如下语法错误：

   "data": jsonResponse.data,
        "columns": [
        { "data": "ReleaseID" },
        { "data": "ReleaseName" },
        { "data":  null,      
          "defaultContent": "<button class='btn-Edit'><i class='fa fa-edit'></i>Edit</button>"
          }               
        ],                             
        "order": [[1, 'dsc']]                       
    });

Answer 2

正如@ADyson指出'defaultContent'对象中有一个拼写错误我有一些虚拟数据的例子只有其他更改是假的

$(document).ready(function() {
var data = '{"data":[{"ReleaseID":1,"ReleaseName":"Jam"}]}'
var jsonResponse = JSON.parse(data); 
  var table = $('#register-data').DataTable({
           "data":jsonResponse.data,
          "columns": [
          { "data": "ReleaseID", "title": "ReleaseID" },
          { "data": "ReleaseName", "title": "ReleaseName" },
          { "data":  null,  "title": "Action",      
            "defaultContent": "<button class='btn-Edit'><i class='fa fa-edit'></i>Edit</button>"
            }               
          ],                             
          "order": [[1, 'dsc']]                               
  });
} );

<link rel="stylesheet" href="https://cdn.datatables.net/1.10.18/css/jquery.dataTables.min.css">

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdn.datatables.net/1.10.18/js/jquery.dataTables.min.js"></script>
<div class="container">
  <table cellpadding="0" cellspacing="0" border="0" class="dataTable table table-striped" id="register-data">

  </table>
</div>

<强>文档

Jquery Table API

图标没有出现

2 个答案: