JQuery DataTables 서버 쪽 처리 없음 렌더링

Question

서버 쪽 처리를 사용하여 DataTable을 구현하려고합니다.

내가 알 수있는 한 내가 가지고있는 것은 정확합니다. 그러나 페이지를로드하면 볼 수있는 것은 모두 "No matching records found"입니다.

DataTables 1.10.9를 사용하고 있습니다.

내 테이블은 다음과 같이 설정 :

<table id="resellerListTable" class="table table-hover table-condensed display dataTable no-footer" role="grid"> 
    <thead> 
    <tr role="row"> 
     <th class="sorting_disabled" name="asd"></th> 
     <th class="sorting_disabled">Name</th> 
     <th class="sorting_disabled">Active</th> 
     <th class="sorting_disabled no-sort"></th> 
    </tr> 
    </thead> 
    <tfoot> 
    <tr role="row"> 
     <th class="sorting_disabled" name="asd"></th> 
     <th class="sorting_disabled">Name</th> 
     <th class="sorting_disabled">Active</th> 
     <th class="sorting_disabled no-sort"></th> 
    </tr> 
    </tfoot> 
</table> 

이 DataTable의를 초기화하는 자바 스크립트입니다. 여기

$('#resellerListTable').DataTable({ 
    processing: true, 
    serverSide: true, 
    ajax: { 
     type: 'POST', 
     url: self.ajaxRoute, 
     data: function (d) { 
      // Format DataTables data for the API, and include some required data. 
      var returnData = { 
       controller: controller, 
       method: method, 
       data: d, 
      }; 
      window.$.extend(returnData.data, data); 
      return JSON.stringify(returnData); 
     }, 
     dataSrc: function (d) { 
      // Format API response for DataTables 
      var response = d; 
      if (typeof d.response != 'undefined') { 
       response = d.response; 
      } 
      console.log(JSON.stringify(response)); // Output from this is below... 
      return response; 
     }, 
     async: true, 
     error: function (e) { 
      console.log(e); 
     }, 
     drawCallback: function() { 
      console.log('table drawn'); 
     } 
    } 
}); 

위 console.log()

{ 
    "data": [ 
     [ 
      "<img src='' />", 
      "Something 1", 
      "not active", 
      "<a href='/retailer/edit/1'>Edit</a><a href='/retailer/delete/1'>Delete</a>" 
     ], 
     [ 
      "<img src='' />", 
      "Something 2", 
      "not active", 
      "<a href='/retailer/edit/2'>Edit</a><a href='/retailer/delete/2'>Delete</a>" 
     ], 
     [ 
      "<img src='' />", 
      "Something 3", 
      "not active", 
      "<a href='/retailer/edit/3'>Edit</a><a href='/retailer/delete/3'>Delete</a>" 
     ], 
     [ 
      "<img src='' />", 
      "Something 4", 
      "not active", 
      "<a href='/retailer/edit/4'>Edit</a><a href='/retailer/delete/4'>Delete</a>" 
     ], 
     [ 
      "<img src='' />", 
      "Something 5", 
      "not active", 
      "<a href='/retailer/edit/5'>Edit</a><a href='/retailer/delete/5'>Delete</a>" 
     ], 
     [ 
      "<img src='' />", 
      "Something 6", 
      "not active", 
      "<a href='/retailer/edit/6'>Edit</a><a href='/retailer/delete/6'>Delete</a>" 
     ], 
     [ 
      "<img src='' />", 
      "Something 7", 
      "not active", 
      "<a href='/retailer/edit/7'>Edit</a><a href='/retailer/delete/7'>Delete</a>" 
     ], 
     [ 
      "<img src='' />", 
      "Something 8", 
      "not active", 
      "<a href='/retailer/edit/8'>Edit</a><a href='/retailer/delete/8'>Delete</a>" 
     ], 
     [ 
      "<img src='' />", 
      "Something 9", 
      "not active", 
      "<a href='/retailer/edit/9'>Edit</a><a href='/retailer/delete/9'>Delete</a>" 
     ], 
     [ 
      "<img src='' />", 
      "Something 10", 
      "not active", 
      "<a href='/retailer/edit/10'>Edit</a><a href='/retailer/delete/10'>Delete</a>" 
     ] 
    ], 
    "recordsTotal": "23", 
    "recordsFiltered": "23", 
    "draw": 1 
} 

나는 또한 DataTables가 table drawn마다 새로 고친 후 콘솔에 출력되는이 같은 결과를 그리기 위해 노력하고 있음을 알 수에서 기록 출력입니다.

누구나 올바른 방향으로 나를 가리킬 수 있습니까?

Answer 1

몇 가지

다음 dataSrc 콜백에서

1) 내가 생각 https://datatables.net/reference/option/ajax.dataSrc

2)의 예에 따라

return response; 

대신

return response.data; 

를 넣어 JSON의 "데이터"안의 항목은 객체가 아니라 객체이어야합니다. 배열, 즉

"data": [ { "<img src='' />", "Something 1", "not active", "<a href='/retailer/edit/1'>Edit</a><a href='/retailer/delete/1'>Delete</a>" }... 

{...}는 배열을 나타내는 [...] 대신 객체를 나타냅니다. 그리고 객체의 각 항목에는 그것이 속하는 열을 나타내는 속성 이름, 예를 들어 g가 있어야합니다. `대신 반환 응답`의;

"column1": "<img src='' />" 

가 DATASRC 콜백에서`반환 response.data을 시도