Question

美好的一天！

如何将JSON数据显示在表格中？这是我得到的json数据..

{"total":1,"per_page":6,"current_page":1,"last_page":1,"from":1,"to":1,
"data":{"id":999,
   "firstName":"user999",
   "lastName":"lastname999",
   "middleName":"middlename999",
   "company":"999 Company",
   "email":"999@gmail.com",
   "phone":"09063330756",
   "addressStreet":"999 Street",
   "addressCity":"999City",
   "addressProvince":"999Province",
   "addressPostalCode":2147483647,
   "status":null,
   "notes":"Supplier999"}]
}

现在我只是想弄清楚如何将我的数据显示到表中..然后我会尝试对它进行分页，顺便说一下我使用AJAX调用。

这是我的ajax代码：

function search(){


var keyWord = $("#searchSupplier").val();
$.ajax({
    url: 'api/searchSupplier',
    type: 'get',
    data: {searchKey: keyWord},
    success: function(response) {

        $('table#supplierTable tbody').html("<tr><td>"+response.data+"</td></tr>");
    }
});
}

我试图：

console.log(response.data) = undefined

和

console.log(response) = the JSON data above.

这是我的laravel代码：

public function getSuppliers()
{
   $input = Input::get('searchKey');
   return Supplier::where('firstName', 'like', '%'.$input.'%')->paginate(6)->toJson();
}

提前致谢。

Answer 1

如果您要手动执行此操作，则需要执行以下操作：

success: function(response){
  var html = '<table><tbody>';
  response.data.forEach(function(row){
    html += '<tr><td>' + row.id + '</td><td>' + row.firstName + ...;
  });
  html += '</tbody></table>';
  //Set some elements innerHTML to html, or create the table some other way
}

如果服务器正确提供JSON，jQuery将自动将其解析为您可以以上述方式访问的javascript对象。

Answer 2

使用datables插件，它是开源的，易于使用。

http://datatables.net/

将JSON数据显示到带有分页标题的表中

2 个答案: