将数据填充到数据表的列中

我从服务器获取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> 
    $(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的开发者工具中存在，但数据未填充到表中。

来源

2017-01-30 user3711100

你是让你的代码非常复杂，你可以轻松地处理它....请写你的HTML也或你的DIV或SPAN类的名称，你想更新你的JSON响应 –

你不清楚你想要在哪里显示（呈现）您的数据。你可能想用javascript（使用检索的数据）创建新的html表格标记，并追加到页面上的某个地方。 – misher

嗨，我已经添加了用于呈现数据的HTML代码。 Datatable id是＃dataTables-example – user3711100

像这样的东西应该工作：

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。

来源

2017-01-30 14:54:16 annoyingmouse

嗨，感谢您的回复。我正在获取3个字段的dataArray，但表没有被填充。它显示'处理'。你可以请检查我的HTML代码的任何问题。 – user3711100

将数据填充到数据表的列中

回答

相关问题