Retrieve image from SQL display in grid

[Gopre400Participant]

Hi I would like to retrieve an image from a field in a SQL table and display it in a grid. Is this possible? Do you have an example or resource?

[Peter StoevKeymaster]

Hi Gopre400,

I suppose that by using the cellsrenderer callback function, you will be able to display such image. If your image is stored as byte array, then you can return IMG tag in the cellsrenderer that uses it. Ex: http://stackoverflow.com/questions/9463981/displaying-byte-array-as-image-using-javascript

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com/

[Gopre400Participant]

Thank you Peter, here is what I came up with for those that are curious. It works great.

Image renderer:
var imagerenderer = function (row, datafield, value, defaulthtml, columnproperties, rowdata) {
return ;
}

column in grid:
{ text: ‘Image’, datafield: ‘RequestedImage’, width: 100, cellsrenderer: imagerenderer },

GetImageHandler.ashx
Sub ProcessRequest(ByVal context As HttpContext) Implements IHttpHandler.ProcessRequest
Dim signid As String = context.Request.QueryString(“signid”).ToString
Using con As New SqlConnection(GetConnectionString(“myconnection”))
Using cmd As New SqlCommand()
cmd.CommandType = CommandType.StoredProcedure
cmd.CommandText = “spSRQSignWithImageBySignID”
cmd.Parameters.AddWithValue(“@pSignID”, signid)
cmd.Connection = con
con.Open()
Dim sdr As SqlDataReader = cmd.ExecuteReader()
If sdr.HasRows Then
While sdr.Read()
Dim imageBytes As Byte() = DirectCast(sdr(2), Byte())
context.Response.ContentType = “image/jpeg”
context.Response.BinaryWrite(imageBytes)
End While
Else
context.Response.StatusCode = 404
End If
con.Close()
End Using
End Using
End Sub

[Gopre400Participant]

var imagerenderer = function (row, datafield, value, defaulthtml, columnproperties, rowdata) {
      return '<img style="height="100" width="100" src="GetImageHandler.ashx"/>';
 }

[Author]

Posts