Display Base 64 Image

Display Base 64 Image

alf007alf007 Posts: 37Questions: 15Answers: 0

Hi!

I have a base64 string image in my databse, How can I display this image in a row?

Example:

String: iVBORw0KGgoAAAANSUhEUgAAAEAAAA......

<img src="data:image/png;base64,iVBORw0KGgoAAAAN" />

What I want is to get the string and add the html img tag to display the image correctly.

I hope I made my self clear.

Thank you.

This question has an accepted answers - jump to answer

Answers

  • bindridbindrid Posts: 730Questions: 0Answers: 119

    More than one? I usually create a css class that contains that image then add the class to a span or button whatever depending on context of how its being used.

  • bindridbindrid Posts: 730Questions: 0Answers: 119

    I built one that puts check marks on buttons inside a datatable. You can see it
    http://jsbin.com/dibuga/edit?html,css,js,output

  • allanallan Posts: 63,680Questions: 1Answers: 10,498 Site admin
    Answer ✓

    @alf007 - We'd really need more information. Are you ajax loading the data and that contains the base 64 string for example? In which case use a renderer to create the img tag.

    Allan

  • alf007alf007 Posts: 37Questions: 15Answers: 0

    Thanks @allan, @bindrid for your comments. I finally solve the problem using a renderer.

    Here is the result:

    { data: "image",     
                        render: function ( data, type, row ) {
                            return '<img src="data:image/jpeg;base64,'+ data + '" width="150px" height="150px">';
                        }
                    }
    
  • blacforce18blacforce18 Posts: 1Questions: 0Answers: 0

    image: 'data:image/png;base64,<?php $im = file_get_contents('images/reportheader.png'); $imdata = base64_encode($im); echo $imdata; ?>'

This discussion has been closed.