Làm cách nào để đặt nhiều dữ liệu trong một cột có thể định giá?

Question

Tôi đang sử dụng Datatables để trình bày dữ liệu từ JSON. JSON của tôi là như sau:

[{"name": "John Doe", "email": "john@gmail.com", "address" : "blah"}] 

Trong Datatables tôi có thể dễ dàng hiển thị những 3 mẩu thông tin trong 3 cột khác bằng cách sử dụng sau đây:

columnDefs = [ 
       { "mData": "name", "aTargets":[0] }, 
       { "mData": "email", "aTargets":[1] }, 
       { "mData": "address", "aTargets":[2] } 
      ]; 

Nhưng vấn đề là tôi muốn thể hiện " tên "và" email "trong cột đầu tiên và sau đó" địa chỉ "trong cột thứ hai. Tôi có thể làm như thế nào? Xin vui lòng hướng dẫn.

Answer 1

Thay vì đặt tên hoặc e-mail trong cột đầu tiên trong định nghĩa cột, bạn có thể sử dụng hàm để lấy và in bất kỳ dữ liệu nào bạn muốn. Xem phần mData trên trang này để biết thêm chi tiết: https://datatables.net/usage/columns. Trong ví dụ của tôi dưới đây tôi sử dụng aoColumns vì tôi đã thử nghiệm câu trả lời của tôi theo cách đó; nhưng trong liên kết được tham chiếu, họ đã sử dụng aoColumnDefs và cung cấp việc xây dựng trên các trường kiểu và các trường dữ liệu. Cách tiếp cận này hy vọng sẽ giúp bất cứ ai đọc câu trả lời này cho dù bạn sử dụng aoColumns hoặc aoColumnDefs.

Ví dụ, sử dụng aoColumns hơn aoColumnDefs:

aoColumns = [ 
    { "mData": getNameAndEmail }, 
    { "mData": "address" } 
]; 

Sau đó, xác định chức năng getNameAndEmail trong phạm vi hoạt Javascript mà mất ba thông số: dữ liệu thông qua trở lại, loại hành động trên dữ liệu, và nếu loại được "đặt" rồi đặt dữ liệu.

function getNameAndEmail(data, type, dataToSet) { 
    return data.name + "<br>" + data.email; 
} 

Answer 2

để làm cho nó ngắn hơn, bạn có thể viết nó như thế này

"aoColumns": [ 
    { "mData": "i_id" }, 
    { "mData": "i_name" }, 
    { "mData": function (data, type, dataToSet) { 
     return data.i_id + "<br/>" + data.i_name; 
    }} 
], 

và kết quả