Show Image In RadGrid

[vinamra]

Hi i want to show image in Radgrid(Prometheus)
i hav image url in database an i want to show image in every row to there respective image.

my query is simple.
how to show image in each row.

Thanks
Vinamra Bhatnagar

    protected void BtnSearch_Click(object sender, EventArgs e)
    {
        String query = "SELECT Student.RollNo, Student.Name, Student.Batch, Course.Name AS Course, University.Name AS University, Student.Gender, Student.Birth_Date, Student.EmailId, Student.Address, Student.City, Student.[State/Province], Student.[Zip/Postal Code], Student.[Country/Region], Student.[Mobile Phone], Student.[Web Page], Student.Photo FROM University INNER JOIN Student ON University.code = Student.UniversityCode INNER JOIN Course ON Student.CourseId = Course.Id ";
        switch (RadComboBox1.SelectedIndex)
        {
            case 0:
                SqlDataSource1.SelectCommand = query +"WHERE (Student.RollNo = '" + TbSearchBox.Text + "')";
                RadGrid1.DataBind();
                break;
            case 1:
                SqlDataSource1.SelectCommand = query + "WHERE (Student.Name LIKE '" + TbSearchBox.Text + "%')";
                RadGrid1.DataBind();
                break;
            case 2:
                SqlDataSource1.SelectCommand = query + "WHERE (Student.Batch = '" + TbSearchBox.Text + "')";
                RadGrid1.DataBind();
                break;

        }
    }

[Shinu]

Hi,

Try adding one GridTemplateColumn with an image in the ItemTemplate.Query the ImageUrl and set the ImageUrl property for the image in the code behind. You can also refer the following demo link to get more information regarding the column types supported by RadGrid.
Column types

Thanks
Shinu

[vinamra]

Hi thanks
Plz Give an example i a newbie how to set image url
plz

thanks
vinamra bhatnagar

[Princy]

Hi,

Try accessing the image in a GridTemplateColumn as shown below.

ASPX:

 <telerik:GridTemplateColumn UniqueName="TempCol"  DataField="TempField"  HeaderText="TempCol"  >
                     <ItemTemplate>
                         <asp:Image ID="Image1" runat="server" />
                     </ItemTemplate>
                  </telerik:GridTemplateColumn>

CS:

 protected void RadGrid1_ItemDataBound(object sender, Telerik.Web.UI.GridItemEventArgs e)
    {
        if (e.Item is GridDataItem)
        {
            GridDataItem item = (GridDataItem)e.Item;
          // you can access the image and set the ImageUrl property
            Image image = (Image)item["TempCol"].FindControl("Image1");
        }
    }

Thanks
Princy.

[Daniel Aquere]

Hi everyone,

Please, I need to show an image in "column image"  in accordance with two fields in dataset. These fields don´t show in the grid, so it´s necessary access by dataset. This is the problem, how can I access fields on the dataset when the grid is building?

===> ASP.NET code

<telerik:RadGrid ID="RadGrid1" runat="server" AllowPaging="True" 
        DataSourceID="DS1_grid1" Skin="Sunset" Culture="Portuguese (Brazil)" PageSize="20" >

        <HeaderContextMenu CssClass="GridContextMenu GridContextMenu_Sunset" 
            EnableImageSprites="True">
        </HeaderContextMenu>
        <MasterTableView AutoGenerateColumns="false" ShowHeadersWhenNoRecords="true" EnableNoRecordsTemplate="true">
           
            <Columns>
                <telerik:GridBoundColumn AllowFiltering="false" DataField="projeto" 
                    HeaderStyle-Width="100px" HeaderText="PROJETO" UniqueName="projeto">
                    <HeaderStyle Width="200px" />
                </telerik:GridBoundColumn>
                
                <telerik:GridButtonColumn CommandName="MyCommand" ButtonType="ImageButton" UniqueName="ButtonColumn"> </telerik:GridButtonColumn>
                
            </Columns>
            
        </MasterTableView>
        
    </telerik:RadGrid>

Thanks in advance.

Best

Daniel

[Princy]

Hello Daniel,

One option you can set image url in ItemDataBound event based on the value of other columns in DataSet. The following code snippet shows how to get the column value.

C#:

protected void RadGrid1_ItemDataBound(object sender, GridItemEventArgs e)
  {
      if (e.Item.DataItem is DataRowView)
      {
          DataRowView drw = (DataRowView)e.Item.DataItem;
          string value = drw["ColumnName"].ToString();
      }
  }

Thanks,
Princy.

[Daniel Aquere]

Hi Princy,

Thanks for your attention and quickly response.

Now I can see the field´s values. Great!

But, the image is not applied. (C# code below):

I put a break point to debug in line "if (value > 0)", the application never passed in this point.
Another test was, if I remove the line "if (e.Item.DataItem is DataRowView)" the following error message appears "Object reference not set to an instance of an object." about line "ImageButton img = dataItem["oknok"].Controls[0] as ImageButton;".

Please, what´s happening?

Thanks,

Daniel

----------------------------- C# code
protected void RadGrid1_ItemDataBound(object sender, GridItemEventArgs e)
    {
        if (e.Item.DataItem is DataRowView)
        {

            GridDataItem dataItem = e.Item as GridDataItem;
            ImageButton img = dataItem["oknok"].Controls[0] as ImageButton;

            DataRowView drw = (DataRowView)e.Item.DataItem;
            int value = int.Parse(drw["custo_pxe"].ToString());
            if (value > 0)
            {
                img.ImageUrl = "~/images/RED_Ball.png";
            }
            else
            {
                img.ImageUrl = "~/images/GREEN_Ball.png";
            }
        }
    }

[Daniel Aquere]

Hi everyone,

SOLVED with this code:

GridDataItem

 

 

dataItem = e.Item as GridDataItem;

 

 

 

 

 

 

DataRowView drw = (DataRowView)e.Item.DataItem;

 

 

 

 

int value_custo = int.Parse(drw["custo_pxr"].ToString());

 

 

 

 

if (value_custo > 0)

 

 

{

 

dataItem[

 

"custo_pxr"].ForeColor = Color.Red;

 

 

dataItem[

 

"custo_pxr"].Font.Bold = true;

 

 

(dataItem[

 

"status_custo"].Controls[0] as ImageButton).ImageUrl = "~/images/RED_Ball_PMPartner_custo.png";

 

 

}

 

 

 

else

 

{

dataItem[

 

"custo_pxr"].ForeColor = Color.Green;

 

 

dataItem[

 

"custo_pxr"].Font.Bold = false;

 

 

(dataItem[

 

"status_custo"].Controls[0] as ImageButton).ImageUrl = "~/images/GREEN_Ball_PMPartner_custo.png";

 

 

}

Thanks.

Daniel

[Haider S]

thanks :D .. helped me