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

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 对象。