Add image to cell getting it from WebAPI like hex or base64

[Agne]

Hello,

I want to add image to my treeGrid. I am getting data from WebAPI. Image is also getting from WebAPI like hex (type - byte[]) (0x89504E470D0A....). In my treeGrid  I think it looks like base64 (iVBORw0KGgoAA....). I want it to show like image.

I am getting data from WebAPI and displaying like:

This is the response from WebAPI:

And the view is like this:

I want that in column PictureContent there will be images instead of symbols.

Is there a possibility to do that?

[Jayakumar Duraisamy]

Hi Agne, 

Please find the response below. 

In TreeGrid, we have column template support to render custom columns. We know that HTML img tag have default support to decode base64 image source. Hence, we can use HTML img tag inside the column template to display the encoded images.  

Please refer following code snippet, 

<!--Column Template  -->     

<script type="text/x-jsrender" id="imageTemplate"> 

        <img src="data:png;base64,{{:FullName}}"> 

</script> 

 

$("#TreeGridContainer").ejTreeGrid({ 

//… 

columns: [ 

//… 

{ field: "FullName", headerText: "Image", isTemplateColumn: true, templateID: "imageTemplate",},                    

                ], 

}) 

 

 

We have prepared a sample with default image byte code in JSON object. Please find the sample location as below, 

Sample: http://www.syncfusion.com/downloads/support/directtrac/general/ze/Sample-802523403.zip 

Please let us know if you require further assistance on this. 

Regards, 

Jayakumar D