Go Premium for a chance to win a PS4. Enter to Win

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 870
  • Last Modified:

Icon Conditional Format in Gridview

I have a Gridview and I have a column heading named 'Locked'. The output is either a 'Y' or 'N'. I would like to have it substituted with an icon. So when it has a 'Y' I would like an icon of a green lock icon (Which I have in the ~\Content\Images folder). Also when it is a 'N' I would like to have it substituted with a Green Lock icon. This is very similar to Excel's icon conditional formatting. Any clues?
0
Southern_Gentleman
Asked:
Southern_Gentleman
  • 2
1 Solution
 
Dale BurrellCommented:
Use a template field, with an image inside it and bind the image source to a field in your query which is conditional on whether its locked or not.
0
 
Manoj PatilSr. Software EngineerCommented:
Hey for this you need to do it by following way,

First Take an Label in your template filed. Your template filed may looks like below.
Set Visible=False for Label

<asp:TemplateField HeaderText="Status">                
                    <ItemTemplate>
                    <asp:Image ID="imgStatus" runat="server"  />
                        <asp:Label ID="lblStatus" runat="server" 
                       Text='<%#Eval("Status") %>'   Visible="false" />
                    </ItemTemplate>
                </asp:TemplateField>

Open in new window


In code behind add below code and bind this method RowDataBound to the GridView

DON'T FORGET TO CHANGE THE CELL NUMBER IN IF CONDITION. IT IS THE COLUMN NUMBER IN WHICH THE LABEL IS GOING TO BE SET.

protected void gvDetails_RowDataBound(object sender, GridViewRowEventArgs e)
{
   try
   {
         if (e.Row.RowType == DataControlRowType.DataRow)
         {
               if (e.Row.Cells[6].HasControls())
               {
                   Label lblStatus = (Label)e.Row.Cells[6].FindControl("lblStatus");
                   System.Web.UI.WebControls.Image imgbtn = ((System.Web.UI.WebControls.Image)e.Row.Cells[6].FindControl("imgStatus"));
                        if (lblStatus != null)
                        {
                            if (lblStatus.Text == "Active")
                            {
                                imgbtn.ImageUrl = "~/Setting/images/icon/color_18/hand_thumbsup.png";
                                imgbtn.ToolTip = "Active";
                            }
                            else if (lblStatus.Text == "DeActive")
                            {
                                imgbtn.ImageUrl = "~/Setting/images/icon/color_18/hand_thumbsdown.png";
                                imgbtn.ToolTip = "Deactive";
                            }
                        }
             }

     }
  catch {    }
}

Open in new window

0
 
Southern_GentlemanAuthor Commented:
So I set my Gridview field template (Locked) and then assigned the code behind but it is coming up blank for that column. Here is my code. 1st for the ASP, then the code behind. I'm also using Devexpress for my objects.  

<dx:GridViewDataTextColumn Caption="Locked" FieldName="Locked" ShowInCustomizationForm="True" VisibleIndex="7">
                                    <DataItemTemplate>
                                        <asp:Image ID="imgStatus" runat="server" Height="20px" Width="20px" />
                                        <asp:Label ID="lblStatus" runat="server" Text='<%#Eval("Locked")%>' Visible="false" />                                         
                                    </DataItemTemplate>
                                    <HeaderStyle HorizontalAlign="Center" />
                                    <CellStyle HorizontalAlign="Center" Wrap="False">
                                        </CellStyle>
                                </dx:GridViewDataTextColumn>


 Protected Sub ASPxGridView1_RowDataBound(sender As Object, e As GridViewRowEventArgs)
        Try
            If e.Row.RowType = DataControlRowType.DataRow Then
                If e.Row.Cells(7).HasControls() Then
                    Dim lblStatus As Label = DirectCast(e.Row.Cells(7).FindControl("lblStatus"), Label)
                    Dim imgbtn As System.Web.UI.WebControls.Image = DirectCast(e.Row.Cells(7).FindControl("imgStatus"), System.Web.UI.WebControls.Image)
                    If lblStatus IsNot Nothing Then
                        If lblStatus.Text = "Y" Then
                            imgbtn.ImageUrl = "~/Images/greenlock.png"
                            imgbtn.ToolTip = "Y"
                        ElseIf lblStatus.Text = "N" Then
                            imgbtn.ImageUrl = "~/Images/redlock.png"
                            imgbtn.ToolTip = "N"
                        End If
                    End If

                End If
            End If
        Catch
        End Try

        If True Then
        End If
    End Sub

Open in new window

0
 
Southern_GentlemanAuthor Commented:
I actually figured it out. Thanks again for leading me in the right direction.
0

Featured Post

Free Tool: Path Explorer

An intuitive utility to help find the CSS path to UI elements on a webpage. These paths are used frequently in a variety of front-end development and QA automation tasks.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now