데이터 테이블에 데이터 채우기

Question

서버에서 json 개체 응답을 받고 있지만 데이터를 열로 렌더링 할 수 없습니다. 감사합니다.

JSON OBJECT RESPONSE: 
{ 
"CHD2": { 
"POSName": "CHANDIGARH INDU. AREA-I", 
"HODB": "QSR_PHASE-I_CHANDIGARH" 
}, 
"D002": { 
"POSName": "DEHRADUN-ASTLEY HALL", 
"HODB": "QSR_DEHRADUN_ASTLEY" 
}, 
"J002": { 
"POSName": "VAISHALI NAGAR", 
"HODB": "QSR_VAISHALI_NAGAR" 
} 
} 

JQUERY SCRIPT

<script> 
    $(document).ready(function() { 
    console.log('Initializing tables...'); 
    var <a href="//legacy.datatables.net/ref#aaData">aaData</a> = []; 
     $('#dataTables-example').DataTable({ 
      responsive: true, 
      processing: true, 
      serverSide: true, 
      data : aaData, 
      ajax: { 
       url:'http://localhost:81/reporting/outletList.php', 
       type:'POST', 
       dataType:'json', 
       dataSrc : "", 
       error: function(errorThrown){ 
        alert(errorThrown); 
        alert("There is an error with AJAX!"); 
       }, 
      "success": function(data) { 
           console.log(data); 
       aaData.push([ 
         data['CHD2'].POSName, 
         data['CHD2'].HODB 
        ]); 
       aaData.push([ 
        data['D002'].POSName, 
        data['D002'].HODB 
       ]); 
       data = aaData; 
       console.log(data); 
      }}, 
      /*columns: [ 
       { data: "POSName"}, 
       { data: "HODB"} 
      ],*/ 
      "language": { 
      "zeroRecords": "No records to display" 
      } 
      }) 
     }); 
    </script> 



<div class="panel-body"> 
    <table width="100%" class="table table-striped table-bordered table-hover" id="dataTables-example"> 
    <thead> 
    <tr> 
    <th>POSName</th> 
    <th>HODB</th> 
    </tr> 
    </thead> 

정지가 작동하지 않습니다. JSON 개체 응답이 Chrome의 개발자 도구에 있지만 데이터가 테이블에 채워지지 않습니다. 이 같은

Answer 1

뭔가 작업을해야합니다 :

let data = { 
    "CHD2": { 
     "POSName": "CHANDIGARH INDU. AREA-I", 
     "HODB": "QSR_PHASE-I_CHANDIGARH" 
    }, 
    "D002": { 
     "POSName": "DEHRADUN-ASTLEY HALL", 
     "HODB": "QSR_DEHRADUN_ASTLEY" 
    }, 
    "J002": { 
     "POSName": "VAISHALI NAGAR", 
     "HODB": "QSR_VAISHALI_NAGAR" 
    } 
    }, 
    dataArray = []; 

for (let item in data) { 
    let row = { 
    "Name": item 
    }; 
    for (let element in data[item]) { 
    console.log(data[item][element]); 
    row[element] = data[item][element]; 
    } 
    dataArray.push(row); 
} 
console.log(dataArray); 

을이이 데이터를 대표해야 rows 일을 일단. JSFiddle 작업 here.