We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

I need some example of the grid loading img from database saved like byte[]

I need some example of the grid loading img from database saved like byte[] (with Net core 2 Razor Pages)

3 Replies

TS Thavasianand Sankaranarayanan Syncfusion Team March 28, 2019 03:38 AM UTC

Hi Nelson, 

Greetings from Syncfusion support. 

You need to follow the below steps to achieve this requirement. 

Step #1: First you need to convert the byte array to base64 string. You can achieve this requirement like as following code snippet, 

string base64String = Convert.ToBase64String(bytes, 0, bytes.Length); // Convert the bytes to base64 string 

Step #2: You need to add this converted base64 string with Grid data source. 

Step #3: When you display the image in Grid to column, you need to convert this base64 string to image. We suggest you to use queryCellInfo event of the Grid to achieve this requirement. Please refer the following code snippet, 

function queryCellInfo(args) { // Grid queyCellInfo event 
        if (args.column.field == "Image") { 
           var image = new Image(); 
            image.src = "data:image/png;base64," + args.data.Image; // base64 string 
            args.cell.appendChild(image); // Appended the image to particular cell 

In this code we have converted and appended the based64 string to Grid cell with the help of Grid queryCellInfo event. You can access the base64 string in this queryCellInfo event argument(i.e args.data). 

Thavasianand S. 

NE Nelson April 4, 2019 08:10 PM UTC

Thanks. This help me a lot

HJ Hariharan J V Syncfusion Team April 5, 2019 05:57 AM UTC

Live Chat Icon For mobile
Up arrow icon