Question

现在json数据已存储在ajax中的变量“msg”中。我只能在页面中提醒（msg）。但是我想将它放入数据表或者用ajax或js中的列查看数据的任何正确方法。

这是json类型：

{ "aaData": [ { "ID": "1", "FESTIVAL": "Antipodes Festival", "SUBURB": "Lonsdale Street, Melbourne", "POSTCODE": "3000", "WEBSITE": "http://www.antipodesfestival.com.au/", "DESCRIPTION": "The greek precinct in melbourne cbd will transform into a huge, free street festival with the hosting of the antipodes lonsdale street festival which will hold sway from 14 february 2015 to 15 february 2015." }, { "ID": "5", "FESTIVAL": "Boite Singers Festival", "SUBURB": "Victoria", "POSTCODE": "3000", "WEBSITE": "http://boite.com.au/index.php", "DESCRIPTION": "The boite singers festival brings you four days of vocal inspiration and sheer fun on the second weekend of january each year." } ] }

Answer 1

我不清楚您的问题，但我认为您希望将JSON值显示为表格！

＆＃13;

$(document).ready(function(){
var myjson = { "aaData": [ { "ID": "1", "FESTIVAL": "Antipodes Festival", "SUBURB": "Lonsdale Street, Melbourne", "POSTCODE": "3000", "WEBSITE": "http://www.antipodesfestival.com.au/", "DESCRIPTION": "The greek precinct in melbourne cbd will transform into a huge, free street festival with the hosting of the antipodes lonsdale street festival which will hold sway from 14 february 2015 to 15 february 2015." }, { "ID": "5", "FESTIVAL": "Boite Singers Festival", "SUBURB": "Victoria", "POSTCODE": "3000", "WEBSITE": "http://boite.com.au/index.php", "DESCRIPTION": "The boite singers festival brings you four days of vocal inspiration and sheer fun on the second weekend of january each year." } ] } ;
 console.log(myjson);
 for(i=0;i < myjson.aaData.length;i++){
  var html='';
  $.each(myjson.aaData[i], function(ind,val){
      html +='<td>'+val+'</td>';
  });
  $('#table_id tbody').append('<tr>'+html+'</tr>');
 }
   $('#table_id').DataTable();
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="http://cdn.datatables.net/1.10.9/css/jquery.dataTables.css" rel="stylesheet"/>
<script src="http://cdn.datatables.net/1.10.9/js/jquery.dataTables.js"></script>
<table id="table_id" class="display">
    <thead>
        <tr>
          <th>ID</th>
          <th>FESTIVAL</th> 
          <th>SUBURB</th>
          <th>POSTCODE</th>
          <th>WEBSITE</th>
          <th>DESCRIPTION</th>
        </tr>
    </thead>
    <tbody>        
    </tbody>
</table>

＆＃13;

我希望这会对你有所帮助:)。

Answer 2

这样就完成了

//html
<table id="example" class="display" width="100%">
</table>

//jquery
$('#example').DataTable( {
    "aaData": data,
    "aoColumns": [
        { "mDataProp": "name" },
        { "mDataProp": "position" },
        { "mDataProp": "office" },
        { "mDataProp": "extn" },
        { "mDataProp": "start_date" },
        { "mDataProp": "salary" }
    ]
} );
//data source

var data= [
{
  "name": "Tiger Nixon",
  "position": "System Architect",
  "salary": "$320,800",
  "start_date": "2011/04/25",
  "office": "Edinburgh",
  "extn": "5421"
},
{
  "name": "Garrett Winters",
  "position": "Accountant",
  "salary": "$170,750",
  "start_date": "2011/07/25",
  "office": "Tokyo",
  "extn": "8422"
}
]

你应该参考this stackoverflow问题。和this小提琴

Answer 3

这段对我有用的代码试试这个

Expected spy navigate to have been called with [ [ 'student/info' ] ] but it was never called.

将Json转换为ajax中的jquery-datatable？

3 个答案: