How to bind to Image Field in table

[James]

Hi,

This is probably a simple one, but when I use the auto generate to retrieve records from a table, I get all my fields, including an image displayed for an image field when I click the "test query" button.

When I look at the grid however, the image field is missing. How can I add a column to bind to and display the image field from the SQL table?

thx in advance

[Shinu]

Hi Bobby,

Hope you have set AutoGenerateColumns property to true. This property will create Columns automatically at runtime. To bind the image field you may consider adding one GridButtonColumn/GridTemplateColumn manually to the Grid's column collection.
Column types

Shinu.

[James]

Hi Shinu,

thanks for the reply. I'm still a bit stumped unfortunately. The auto generate columns at runtime is enabled.

The gridbuttoncolumn only seems to allow simple datatypes (e.g. byte, int, string)

I can see how to use a template to put an image in a template column, but how would I bind it to a field in the SQL table as it usually expects an image file on disk

Thanks in advance

[Ron]

Hi,

Did you get an solution for your Question already. I need similair functionality in my app.
I have images stored in an Oracle DB that I need to collect in a Date Table first  and bind afterwards to a Grid.

Any help on this would be highly appriciated.

Thanks,
Ron

[BobbyOwens]

Hi Ron,

I ended up having to do it semi manually. I've created a template column using the following code:

                <telerik:GridTemplateColumn HeaderText="Image" UniqueName="Image"  HeaderStyle-Width="100px">
                <ItemTemplate>
                    <asp:ImageButton ID="imgPhoto" runat="server" Width="100px" />                   
                </ItemTemplate>
                <EditItemTemplate>
                    <asp:FileUpload ID="FileUpload1" runat="server" />
                </EditItemTemplate>
            </telerik:GridTemplateColumn>  

Then I have code in the DataBinding event to read the image from the database, write it to disk and then allow it to be displayed in the grid:

Public Sub mimbImage_DataBinding(ByVal sender As Object, ByVal e As EventArgs)
        Try
            Dim imbImage As System.Web.UI.WebControls.ImageButton = DirectCast(sender, System.Web.UI.WebControls.ImageButton)
            Dim container As GridDataItem = DirectCast(imbImage.NamingContainer, GridDataItem)
            Dim drvDataRowView As DataRowView = DirectCast(container.DataItem, DataRowView)

            Dim RecordID As String = drvDataRowView("ID").ToString()
            Dim strImage As String = mstrTableName & "_" & RecordID & "_" & Now.ToString("yyyyMMDDHHmmss") & ".jpg"
            Dim strImagePath As String = "~/Pictures/" & strImage
            Dim connection As SqlConnection = New SqlConnection(ConfigurationManager.ConnectionStrings("TitanicConnectionString").ConnectionString)

            Try
                connection.Open()

                Dim command As SqlCommand = New SqlCommand("SELECT Picture FROM " & mstrTableName & " WHERE (" & mstrTableName & "ID=" + RecordID + ")", connection)
                Dim fltImage As System.IO.FileStream = Nothing
                Dim bytImage As Byte() = Nothing
                Dim objResult As Object = command.ExecuteScalar
                Try
                    Try

                        'Execute the stores proc
                        objResult = command.ExecuteScalar

                        'No Image?
                        If Not objResult Is System.DBNull.Value Then

                            'There is an image, to covert it to a byte array
                            bytImage = CType(objResult, Byte())
                        End If
                    Catch ex As Exception

                    End Try

                    'DO we have an object?
                    If Not bytImage Is Nothing Then

                        'Open a file and write out the image
                        Dim dirInfo As New System.IO.DirectoryInfo(msutServer.MapPath("~/Pictures/"))

                        'Does the file alread exist?
                        For Each finFile As System.IO.FileInfo In dirInfo.GetFiles(mstrTableName & "_" & RecordID & "_*.*")

                            'Delete it
                            System.IO.File.Delete(finFile.FullName)
                        Next

                        'Create e new image
                        fltImage = New System.IO.FileStream(msutServer.MapPath(strImagePath), FileMode.CreateNew)

                        'Write the image to disk
                        fltImage.Write(bytImage, 0, bytImage.Length)
                        fltImage.Flush()
                        fltImage.Close()
                        fltImage.Dispose()
                        fltImage = Nothing

                        'Set the image url
                        imbImage.ImageUrl = strImagePath
                        imbImage.PostBackUrl = "~/ShowImage.aspx?Image=~/Pictures/~/Pictures/" & strImage

                    Else
                        imbImage.Visible = False
                    End If

                Catch ex As Exception
                    Throw ex

                Finally
                    If Not fltImage Is Nothing Then
                        fltImage.Close()
                        fltImage = Nothing
                    End If
                    bytImage = Nothing
                End Try

            Finally
                connection.Close()
            End Try
        Catch ex As Exception
        End Try

    End Sub

Becuase I have grids on multiple pages, I've made this quite generic so that the table names/ID Fields are done automatically, and this is actually in a shared module. You can probably ignore the "FileUpload1", as I use it to be able to write to the database. If you want to see how it looks, you can go to www.titanic-collector.co.uk


Hope this helps, but let me know if you need any more info.

Regards

Bobby