string base64String = Convert.ToBase64String(bytes, 0, bytes.Length); // Convert the bytes to base64 string |
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
}
}
|
<GridColumn Field="Imagesrc" HeaderText="Customer Name" Width="200">
<Template>
@{
//you can fetch the byte in Grid datasource from here. And use that byte to get converted to base64String.
var imageUrl = (context as Order).Imagesrc;
//for an example purpose we have get an image and generated the byte. You can use your already stored byte instead of below two lines
Image img = Image.FromFile(@"D:\IEJNC\forums\154812\BlazorApp1\BlazorApp1\wwwroot\scripts\Images\Employees\1.png");
byte[] bytes = (byte[])(new ImageConverter()).ConvertTo(img, typeof(byte[]));
//use the byte to generate a base64String and assign to image to get displayed in Grid
string base64String = Convert.ToBase64String(bytes, 0, bytes.Length);
string imagesrc = "data:image/png;base64," + base64String;
<div class="image">
<img src="@imagesrc" />
</div>
}
</Template>
</GridColumn>
|
<GridColumn Field="Imagesrc" HeaderText="Customer Name" Width="200">
<Template>
@{
<div class="image">
</div>
}
</Template>
</GridColumn>
|