javascript - Jquery在数据表上使用ajax渲染Json内容

Question

我想像这样呈现我的数据表的列：

我的例子

如您所见，数据表说“表中没有可用数据”

我的代码是：

$(function() {
  $('#Spécialité').DataTable(
  {
    "ajax": {
      "processing": false,
      "url": "show_spe",
      "type": "GET",
      "datatype":'json',
      "async": 'true',
      success: function(resp) {
        let string = JSON.stringify(resp);
        let obj = JSON.parse(string);
        $.each( obj, function( key, value )
        {
        $('#Spécialité').append('<tbody><tr><td>'+obj[key]["id"]+'</td> <td>'+obj[key]["description"]+'</td><td><button type="button" class="btn btn-warning" id="edit'+obj[key]["id"]+'">Editer</button>&nbsp;&nbsp;<button type="button" class="btn btn-danger" id="edit'+obj[key]["id"]+'">Supprimer</button></td></tr></tbody>');
        });
      },

  },
  } );

我的json是：

0 {
id : "0"
description : "test" }
1 {
id  : "1" 
description : "ligne2" }

谢谢您的帮助。问候 ：）

标签： javascriptjsonajaxdatatable

Answer 1

我解决问题。

$(function() {

var table = $('#Spécialité').DataTable({
  "ajax": {
    "url": "url",
    "method": "GET",
    "dataSrc": ""
    },
    "columns": [
      { "data": "id"},
      { "data": "description"},
        {
          data: 'id',
          render: function(data)
          {
           return '<button type="button" class="btn btn-warning" onclick="modalEdit('+data+')" name="edit" id="edit'+data+'">Editer</button>&nbsp;&nbsp;<button class="btn btn-danger" type="button" onclick="modalDelete('+data+')" name="delete" id="delete'+data+'">Supprimer</button> ';
          }
        }
      ],
    "order": [[1, "asc"]]
});
});