2013-12-20 79 views
4

我一直試圖在Jquery datatable上顯示Json響應,但沒有成功。基本上一旦服務器返回JSON響應我希望它在桌面上顯示。我得到了JSON檢查,它似乎有效的JSON響應。Json to Jquery DataTable

JSON響應

[ 
    { 
     "pk": 7, 
     "model": "softwareapp.software", 
     "fields": { 
      "city": "miami", 
      "submitted_by": [], 
      "description": "test", 
      "title": "test", 
      "zipcode": "test", 
      "rating_votes": 0, 
      "state": "fl", 
      "address": "test", 
      "rating_score": 0, 
      "business_size": [ 
       5 
      ], 
      "slug": "test", 
      "developer": "test" 
     } 
    }, 
    { 
     "pk": 8, 
     "model": "softwareapp.software", 
     "fields": { 
      "city": "", 
      "submitted_by": [], 
      "description": "", 
      "title": "test2", 
      "zipcode": "", 
      "rating_votes": 0, 
      "state": "", 
      "address": "", 
      "rating_score": 0, 
      "business_size": [ 
       5 
      ], 
      "slug": "test2", 
      "developer": "" 
     } 
    }, 
    { 
     "pk": 10, 
     "model": "softwareapp.software", 
     "fields": { 
      "city": "", 
      "submitted_by": [], 
      "description": "", 
      "title": "test3", 
      "zipcode": "", 
      "rating_votes": 0, 
      "state": "", 
      "address": "", 
      "rating_score": 0, 
      "business_size": [ 
       6 
      ], 
      "slug": "test3", 
      "developer": "" 
     } 
    } 
] 

這裏是Jquery的功能。

<script type="text/javascript" charset="utf8" src="http://ajax.aspnetcdn.com/ajax/jquery.dataTables/1.9.4/jquery.dataTables.min.js"></script> 
<link rel="stylesheet" type="text/css" href="http://ajax.aspnetcdn.com/ajax/jquery.dataTables/1.9.4/css/jquery.dataTables.css"> 

<script> 
$(document).ready(function() { 

    /*var kaboohAPI = '{% url software-list-ajax %}';*/ 
    jsondata = []; 
    $('#filterform').on('submit',function(e){ 
    e.preventDefault(); 
    var query = $('#filterform').serialize(); 
     $.ajax({ 
       type:'GET', 
       url: '{% url software-list-ajax %}', 
       datatype: 'json', 
       data: query, 
       success: function(data){ 
       console.log(data); 
        $('#example').dataTable({ 
          'aaData': data, 
          "aaColumns":[ 
           {"mData":"title"}, 
           {"mData":"developer"} 
          ], 

         }); 
       }/* response processing function ends */ 
      });/* ajax function ends */ 



     }); 
}); 
</script> 

回答

4

這個JSON不被數據表函數讀取。你的JSON應該是一個數組或數組對象的數組。所以更好的方法是將數據附加到普通表中,然後初始化數據表,它將正常工作。

,請參閱以下資源:

+0

有沒有修改客戶端的JSON響應所以它是由數據表中讀取的方式嗎? – shaytac

+0

現貨!將我的ajax源代碼轉換爲對象數組,並且它正在工作:) – Nigilan