Insert Images in RadGrid with Code Behind Only

[Jacques]

Dear Telerik Support Team,

I am programmatically building a RagGrid and I want to insert a thumbnail whose filename is stored in the database (column "VignetteFilename"). (exemple of filename : "picture1.jpg")

Environment : Telerik AJAX RadControls, .Net Framework 3.5, VB.Net

The files are stored on the web server, in the directory : /Models/ImagesModels/

Here is the code I've used for creating the relating GridImageColumn (in VB.Net, using MS SQL Database) :

    Dim imageColumn As New GridImageColumn
               imageColumn.HeaderText = "Thumbnail 1"
                imageColumn.UniqueName = "VignetteFilename"
                imageColumn.DataImageUrlFields = {"VignetteFilename"}
                imageColumn.DataImageUrlFormatString = "~/Models/ImagesModels/{0}"
                imageColumn.AlternateText = "Photo Style 1"
                imageColumn.ImageAlign = "Middle"
                imageColumn.ImageHeight = "110px"
                imageColumn.ImageWidth = "90px"
                rgRadGrid.MasterTableView.Columns.Add(imageColumn)

In the relating Aspx.vb page, I have tried all the kinds of "Protected Sub RadGridSample_ItemDataBound ..." codes I've found on your Support web site, but nothing works.

Could you please help me ?

Many thanks in advance (and congratulations for your terrific product !!!)

Jacques.

[Andrey]

Hi Jacques,

Where are you adding this column? On Page_Init or on Page_Load? As this article says you should add dynamically columns only in these two events.

Verify that your project is following one of the approaches described in the previous article and if the issue persist  you could post more of your code to helps us identify the issue.

Additionally, you could try to remove "~/" from the DataImageUrlFormatString.

Kind regards,
Andrey
the Telerik team

[Jacques]

Hi Andrey,

Thanks for your quick answer. Unfortunately, the problem persists.

I have tried the following code in the Page_Load (in "If Not IsPostback") as well as in Page_PreInit :

        m_SelectQuery = "SELECT MODELID,NOM,PRENOM,EMAIL,VIGNETTE1FILENAME,PHOTO1FILENAME FROM " + _
                            DB_TableModels_C + " ORDER BY DATECREATIONMODEL DESC"
        BuildRadGrid(RadGridModels1, ...)
        Me.PlaceHolderRadGridModels.Controls.Add(RadGridModels1)
   
Here is an extract of the BuildRadGrid procedure :

 Dim imageColumn As New GridImageColumn
                imageColumn.HeaderText = "Thumbnail 1"
                imageColumn.UniqueName = "VIGNETTE1FILENAME"
                imageColumn.DataImageUrlFields = {"VIGNETTE1FILENAME"}
                imageColumn.DataImageUrlFormatString = "Models/ImagesModels/{0}"
                imageColumn.ImageAlign = "Middle"
                imageColumn.ImageHeight = "110px"
                imageColumn.ImageWidth = "90px"
                rgRadGrid.MasterTableView.Columns.Add(imageColumn)

Everything perfectly works (I mean, the RadGrid is correctly displayed) when I use GridBoundColumn(s) only, like : 
 Dim boundColumn As New GridBoundColumn
                boundColumn.DataField = "EMAIL"
                boundColumn.HeaderText = "Courriel"
                boundColumn.UniqueName = "EMAIL"
                boundColumn.AllowFiltering = True
                rgRadGrid.MasterTableView.Columns.Add(boundColumn)

And, when I use the GridImageColumn (as written above), the RadGrid is not displayed and I'm sent back to my default page, with the following URL : www.mydomainname.fr/Default.aspx?aspxerrorpath=/models/modelslist.aspx

Anyway, I have tried to define the RadGrid through the Design mode and everything works (including the GridImageColumn(s)) ; but I prefer to do all through the Programmatic way.

Many thanks in advance for your very kind support.

Jacques.

[Andrey]

Hello Jacques,

As the article from my previous post said you should place the creation logic either in the Page_Load or in the Page_Init events. Page_PreInit event is raised too early in the page life cycle so it is not appropriate for this purpose, as the Grid might not be created yet.

Additionally, the position of this line of code:

rgRadGrid.MasterTableView.Columns.Add(imageColumn)

should be changed based in which event you are defining the structure of RadGrid. If it is in the Page_Load it should be right after the column creation, like this:

Dim imageColumn As New GridImageColumn
rgRadGrid.MasterTableView.Columns.Add(imageColumn)

and if the event is Page_Init it should be like this:

Dim imageColumn As New GridImageColumn
imageColumn.HeaderText = "Thumbnail 1"
imageColumn.UniqueName = "VIGNETTE1FILENAME"
imageColumn.DataImageUrlFields = {"VIGNETTE1FILENAME"}
imageColumn.DataImageUrlFormatString = "Models/ImagesModels/{0}"
imageColumn.ImageAlign = "Middle"
imageColumn.ImageHeight = "110px"
imageColumn.ImageWidth = "90px"
rgRadGrid.MasterTableView.Columns.Add(imageColumn)

The issue with the disappearing Grid is most probably caused by broken structure. Can you elaborate a bit more in the details? Where you have declared the RadGridModels1 object? Is it in some method or is in the Class definition?

Best wishes,
Andrey
the Telerik team

[Jacques]

Dear Andrey,
I did exactly like you wrote, but something else (much more hidden) must have caused the problem.
So, in order to save your time and to avoid that you investigate in very 'deep waters', I have decided to build the Radgrid through the Design mode and it perfectly works. So, I will go on with this choice.
I thank you very much for having worked so nicely on my case.
I consider the case closed.
Kindly regards and thank you again.
Jacques.

[Jacques]

Hi Andrey,

Anyway, in answer to your question, I have declared the RadGridModels1 object in the Class definition of the relating Web page (MyPage.aspx.vb) :

...
Public Class MyPage
    Inherits System.Web.UI.Page
...

#Region "Declarations"
    Protected WithEvents RadGridModels1 As New Global.Telerik.Web.UI.RadGrid
    Private m_SelectQuery As String
#End Region

Then, I build this RadGrid in the Page_Load event :
...
        BuildRadGrid(RadGridModels1, ...)
        Me.PlaceHolderRadGridModels.Controls.Add(RadGridModels1)
...

The BuildRadGrid procedure is located in a Module.

Kindest regards,
Jacques