jQuery Datatable无法将json馈送到表中

jQuery Datatable无法将json馈送到表中,jquery,ajax,json,datatable,Jquery,Ajax,Json,Datatable,这是我从django后端收到的作为响应的json格式。如何使datatable将其读入表中 [{ "model": "model name", "pk": 2, "fields": { "name1": .., "name2": .., } }, { "model": "model name", "pk": 2, "fields": { "name1"

这是我从django后端收到的作为响应的json格式。如何使datatable将其读入表中

[{
    "model": "model name", 
       "pk": 2, 
   "fields": {
         "name1": .., 
         "name2": ..,
         }
  },
  {
    "model": "model name", 
       "pk": 2, 
   "fields": {
         "name1": .., 
         "name2": ..,
         }
  }
]
Javascript:

    $(document).ready( function () {
            $('#tablename')
            .on('xhr.dt', function(e, settings, json){
                console.log(json)
            })
            .DataTable({
                "ajax": {
                    "url": "list",
                    "dataSrc": "",
                },
            });
    });

log(json)将json打印为字符串,而不是JS对象。

在这方面没有什么好办法:

$('#tablename').DataTable({
   ...
   columns : [
      { data : 'fields.name1' },
      { data : 'fields.name2' }
      //etc
   ]        
});

更新(在调查OP网站后)

  • 你的作品非常好
  • 也是
  • 你期待什么

    $.ajax({
        dataType: 'json',
        type: 'GET',
        url: 'list',
    }).done(addDataToTable.bind(this));
    
    function addDataToTable(data){
       this.dt.rows.add(data).draw();
    }
    
    怎么办

  • 按照有据可查的方式直接进行,数百个示例都证明了这一点:

    
    
    var dt=$('#animelist')。数据表({
    阿贾克斯:{
    url:'列表',
    dataSrc:'
    },
    处理:对,
    栏目:[
    {“数据”:“fields.anime_name”,“title”:“anime title”},
    {“数据”:“字段.季节编号”,“标题”:“季节”},
    {“数据”:“字段.观看的剧集”,“标题”:“观看的剧集”},
    {“数据”:“fields.total_集”,“title”:“total集”}
    ]
    });
    

    没别的了。没有创造性的编写ajax调用,没有替代的添加方法,没有字段、名称或标题定义的双重化,没有尾随逗号或其他任何东西

    Uncaught TypeError:无法读取undefined的属性'length'。这是jQuery datatable控制台中显示的错误。无论如何,我使用了另一种方法来解决此问题。由于某些原因,datatable的ajax调用有一个带有GET参数的奇怪url。@Mox“Uncaught TypeError:无法读取未定义的属性'length'”。
    中的列数可能与JSON中指定的字段数不同-它们应该匹配,请参阅JSON示例->datatable调用的ajax确实会得到响应。我已经将其粘贴到javascript中,以便直接加载。它起作用了。但是,当我将源代码更改为ajax时,它将永远无法工作=/@Mox,请参阅更新。当这么简单的代码不适用于您时,您可以很容易地假设是您自己犯了错误,这肯定不是一个bug,解决方案不是让它变得更复杂,而是更简单,最简单的是按照所有文档和手册的指示来做。我可以向您保证,更新答案中的代码是有效的。从您的站点获取源代码,并将其更改回您可能开始使用的源代码。