Is it possible to show image in datatable?

Is it possible to show image in datatable?

bhatt_axaybhatt_axay Posts: 46Questions: 12Answers: 3

Hello,

I show my data in data-table from the database. But I want to show image in the Image field when it returns form the database. Recently it show me only it's URL like below

Image

uplods/abc.jpg

Give me solution or any reference link

This question has an accepted answers - jump to answer

Answers

  • bhatt_axaybhatt_axay Posts: 46Questions: 12Answers: 3
    Answer ✓

    Okk I got the solution for it also

    "columnDefs" : [{
    "targets" : 6 ,
    "data": "img",
    "render" : function ( url, type, full) {
    return '<img height="75%" width="75%" src="'+full[7]+'"/>';
    }]

  • allanallan Posts: 61,438Questions: 1Answers: 10,051 Site admin

    For anyone else who reads this topic, the answer can be found in the columns.render documentation.

  • glendersonglenderson Posts: 231Questions: 11Answers: 29

    Datatables is great! But, why go through the conversion of a render function? Why not pass HTML directly?

    https://jsfiddle.net/glenderson/yg1w6gen/1/

    This fiddle contains images, textboxes, checkboxes, images, etc.

  • allanallan Posts: 61,438Questions: 1Answers: 10,051 Site admin

    Yup - that works as well. DataTables show allow both options, since sometimes it isn't possible to have the HTML you want to be displayed in the JSON data source (a 3rd party feed for example).

    Allan

  • bhatt_axaybhatt_axay Posts: 46Questions: 12Answers: 3

    Hello glenderson,

    I am agree with your solution, but it is possible when my json response array is static. Here i am fetching my data from database then your solution could not help me.

    Thanks for answer.

  • glendersonglenderson Posts: 231Questions: 11Answers: 29

    When using a dom table, it's easy to insert the image as part of the th element.

    When using a database serverside, when returning the json data, format it in the ajax page before you write the json response.

    When using a scripted database, make if part of the returned value, concat('<img src="', filename, '">') as myImage

    When using a static file (like .txt) file, render() is the better solution

  • bhatt_axaybhatt_axay Posts: 46Questions: 12Answers: 3

    Can u provide small example for it? so i can more clear with what u say otherwise alternate solution is i found for it.

    Thanks for replay

This discussion has been closed.