在datatable中渲染嵌套的json

时间:2018-02-16 16:18:54

标签: javascript json datatable

我正在使用一个特定的嵌套json来渲染一些图表(甜甜圈图表..)我想用这个相同的json在数据表中渲染日期 这是我的json的简短版本

{
   "demXXXX": {
      "252XXXXX_101558406XXXX": {
         "name": "XXXX dans sa vie",
         "type": "link",
         "created_time": "2018-02-13 21:30:10",
         "link": "2018-02-13 21:30:10",
         "full_picture": "https://external.xx.fbcdn.net/safe_image.php?d=AQAUUQ601MwIe120&url=https%3A%2F%2Fwww.xxxxxxxea_shutterstock-xxxx.jpg&_nc_hash=AQCBX_V4ErKqeVvs",
         "nb_shares": 105,
         "description": "xxxx",
         "click_publication": 6254,
         "getting_touch": 124083
      },
      "2526XXXXX_10155840181XXXXX7": {
         "name": "Black PXXXX",
         "type": "video",
         "created_time": "2018-02-13 21:00:00",
         "link": "2018-02-13 21:00:00",
         "full_picture": "https://external.xx.fbcdn.net/safe_image.php?d=AQAUUQ601MwIe120&url=https%3A%2F%2Fwww.xxxxxxxea_shutterstock-xxxx.jpg&_nc_hash=AQCBX_V4ErKqeVvs",
         "nb_shares": 101,
         "description": "",
         "click_publication": 7828,
         "getting_touch": 224762
      },
      "nb_posts": 16,
      "nb_posts_link": 10,
      "nb_posts_images": 0,
      "nb_posts_videos": 6,
      "total_nb_personnes_atteintes": 4273856,
      "total_nb_videos_vues": 1323347,
      "total_reactions": 26368,
      "total_commentaires": 25510,
      "total_partages": 6536,
      "nb_clic_publications": 332275
   },
   "demXXXX_food": {
      "91313XXXX_166327179376XXX": {
         "name": "C'est offiXXX",
         "type": "link",
         "created_time": "2018-02-13 19:30:00",
         "link": "2018-02-13 19:30:00",
         "full_picture": "https://external.xx.fbcdn.net/safe_image.php?d=AQAUUQ601MwIe120&url=https%3A%2F%2Fwww.xxxxxxxea_shutterstock-xxxx.jpg&_nc_hash=AQCBX_V4ErKqeVvs",
         "nb_shares": 12,
         "description": "",
         "click_publication": 0,
         "getting_touch": 55039
      },
      "913138XXXX_1663222XXXX1": {
         "name": "Pour lxxXX",
         "type": "video",
         "created_time": "2018-02-13 17:30:01",
         "link": "2018-02-13 17:30:01",
         "full_picture": "https://external.xx.fbcdn.net/safe_image.php?d=AQAUUQ601MwIe120&url=https%3A%2F%2Fwww.xxxxxxxea_shutterstock-xxxx.jpg&_nc_hash=AQCBX_V4ErKqeVvs",
         "nb_shares": 2744,
         "description": "",
         "click_publication": 0,
         "getting_touch": 952160
      },
      "nb_posts": 4,
      "nb_posts_link": 3,
      "nb_posts_images": 0,
      "nb_posts_videos": 1,
      "total_nb_personnes_atteintes": 1242444,
      "total_nb_videos_vues": 274007,
      "total_reactions": 7760,
      "total_commentaires": 4348,
      "total_partages": 3009,
      "nb_clic_publications": 0
   },
}

我成功地在这样的数据表中渲染:

$.ajax({
    url: "analy/test.php",
    data: {timer : timer, page : page},
    dataType: 'json',
    success: function(data){
        $.each(data, function(i, item) {
            var page_name = i;
            $.each(item , function(key , value){

                if(typeof(value) == 'object'){

                    var images_post = value.full_picture;
                    var name_post = value.name;
                    var personnes_atteintes_post = value.getting_touch;
                    var reactions_post = value.reactions;
                    var commentaires_post = value.comments;
                    var partages_post = value.nb_shares;
                    var clic_publications_post = value.click_publication;
                    var type_post = value.type;
                    var vues_video = value.view_video;
                    var total_interaction = reactions_post + commentaires_post + partages_post ;

                    $('#table-post').append('<tr class="data-row"><td><img src='+images_post+' width="250"></td><td><a href = "http://www.facebook.com/'+key+'" target="_blank">'+name_post+'</a></td><td>'+personnes_atteintes_post+'</td><....</tr>');
                }   

            })

        });
    }
});

但我的问题是当我有很多结果像10K行来渲染我的浏览器是冻结所以我想我必须使用延迟加载数据来解决我的问题,但我不认为我可以用我的json结构

0 个答案:

没有答案