Integrating HTML img tag into datatable
I just started using Datatable and I am confused about something. I am unable to integrate the HTML image tag inside the cell. It's about column.render I think, but I think I'm a bit overwhelmed with the document because I still haven't figured out how to do this.
Here is my code, path returns image url.
$('#table_id').DataTable({
"processing": true,
"ajax": {
"url": "req.php",
"type": "POST"
},
"columns": [
{ "data": "id" },
{ "data": "path" },
{ "data": "type" },
{ "data": "keywords" }
]
} );
And what am I trying to do at the moment.
$('#table_id').DataTable({
"processing": true,
"ajax": {
"url": "req.php",
"type": "POST"
},
"columns": [
{ "data": "id" },
{ "data": "path" },
"render": function ( data, type, full, meta ) {
return '<img src="'+data+'">';
{ "data": "type" },
{ "data": "keywords" }
]
} );
I am looking forward to find someone who can rid me of my ignorance.
A good day:)
+3
source to share
1 answer
The render property is outside of the object where yours is "data":"path"
.
You now have this code for your rendering:
"columns": [
{ "data": "id" },
{ "data": "path" },
"render": function ( data, type, full, meta ) {
return '<img src="'+data+'">';
{ "data": "type" },
{ "data": "keywords" }
]
You must rewrite it like this:
"columns": [
{ "data": "id" },
{ "data": "path",
"render": function ( data, type, full, meta ) {
return '<img src="'+data+'">';
}
},
{ "data": "type" },
{ "data": "keywords" }
]
+2
source to share