Different Images in a gridview

Question

I have a question related to gridviews in ASP.NET

I have a gridview that I pull information from a SQL db and it displays the username and current status IE;

• Username | Status
• user1 | Logged Out
• user2 | Logged in
• user3 | On Leave

So this is working all handy dandy, however what I'd like to do is rather that display text for status, I would like to display a "bullet type" image with different colors. red, green, orange, blue - for different status.

Do I need to get these images into the db somehow, or can I use some sort of IF statement to just say, if the status is "1 - Logged in" then display "green.png"?

thanks in advance

Answer 1

Hi,

try to set the corresponding CSS Class, and then set the CSS to use the fitting Background Image. I Think you cannot use a BoundField, but you have to use a TemplateField like this:

<asp:TemplateField>
 <ItemTemplate>
  <div class="StateBar State<%#eval("State") %>">&nbsp;</div>
 </ItemTemplate>
</asp:TemplateField>

And then have a CSS like this:

.StateBar{
display:block;
width:10px;
height:10px;
}

.StateLoggedOut{
background-image:url(/images/...);
}

Hint: Try to have the Status Fields without " "

greetz Christoph

Answer 2

You have 2 way of achieving this:

1 - Modify your query so that the image url comes directly in a column 2 - Do the image selection on the grid construction.

Either way you are going to have to create a template column with a image in it.

Do you need help with that?