Gridview and column with variable image

Collapse
This topic is closed.
X
X
Collapse
 
  • Page of 1
  • Time
  • Show
Clear All
new posts
Previous template Next
  • Froefel
    #1

    Gridview and column with variable image

    Hi group,

    I'm looking for some help on how to achieve the following in a
    gridview control that is based on an ObjectDataSourc e.
    The SelectMethod of the datasource returns a list of Customer objects.
    Each Customer object has a property "Notes".

    When I display the list of customers in the gridview, I would like to
    provide a column that displays an Image associated with the Notes
    property. If the Notes property contains data I want to display a
    colored version of the image. When the Notes property doesn't contain
    data I want to display a grayed version of the image.
    Clicking an image should launch a URL to either view or enter notes.

    A variation on this (for another column in the same grid) is the need
    to display one of several images or no image at all, based on the
    value of a property.
    If a customer's Status property = Yes, display a green image;
    If a customer's Status property = No, display a red image;
    If a customer's Status property = Maybe, display a yellow image;
    If a customer's Status property = Done, don't display an image;

    This behavior is similar to Hotmail's classic display of the message
    icon in the first column, which changed based on whether a message is
    flagged read, unread, replied to, unknown sender, ...

    Does anyone have any suggestions on how to implement this or can
    anyone point me to an article that explains this?

    Thanks
    -- Hans

    Tags: None
    • Alexey Smirnov
      #2
      Re: Gridview and column with variable image


      "Froefel" <hansdeschryver @gmail.comwrote in message
      news:1184943375 .110840.252750@ n60g2000hse.goo glegroups.com.. .
      Hi group,
      >
      I'm looking for some help on how to achieve the following in a
      gridview control that is based on an ObjectDataSourc e.
      The SelectMethod of the datasource returns a list of Customer objects.
      Each Customer object has a property "Notes".
      >
      When I display the list of customers in the gridview, I would like to
      provide a column that displays an Image associated with the Notes
      property. If the Notes property contains data I want to display a
      colored version of the image. When the Notes property doesn't contain
      data I want to display a grayed version of the image.
      Clicking an image should launch a URL to either view or enter notes.
      >
      A variation on this (for another column in the same grid) is the need
      to display one of several images or no image at all, based on the
      value of a property.
      If a customer's Status property = Yes, display a green image;
      If a customer's Status property = No, display a red image;
      If a customer's Status property = Maybe, display a yellow image;
      If a customer's Status property = Done, don't display an image;
      >
      This behavior is similar to Hotmail's classic display of the message
      icon in the first column, which changed based on whether a message is
      flagged read, unread, replied to, unknown sender, ...
      >
      Does anyone have any suggestions on how to implement this or can
      anyone point me to an article that explains this?
      >
      Thanks
      -- Hans
      >
      Hi, Hans

      the easiest way is to have 4 images: yes.gif, no.gif, maybe.gif and done.gif
      and use a value of the Status to build a name of the image:

      <asp:TemplateCo lumn>
      <ItemTemplate >
      <%#"<img src=""" & DataBinder.Eval (Container.Data Item, "Status") &
      ".gif"">"%>
      </ItemTemplate>
      </asp:TemplateCol umn>

      another option is to make a method

      public string getImage(object s)
      {
      if (s == "Yes") {
      return("<img=.. ..");
      }
      .....
      }

      and use it to get an image

      <asp:TemplateCo lumn>
      <ItemTemplate >
      <%# getImage(Contai ner.DataItem, "Status")) %>
      </ItemTemplate>
      </asp:TemplateCol umn>

      Hope this helps


        Comment

        • Froefel
          #3
          Re: Gridview and column with variable image

          Hi Alex,

          Yep, that does it. Meanwhile I found a few articles and they confirmed
          your suggestions. I've implemented it and got it to work... at least
          the basics of displaying the image. In fact, I managed to display a
          dynamic image in an asp:ImageField, but because it cannot have a
          hyperlink associated with it, I also got it to work with a
          asp:ButtonField of Type="image". The ButtonField is clickable through
          the CommandName argument, but I still have to find out how to respond
          to that.
          I'll probably have some questions about that shortly.

          Thanks for the hints.


          On Jul 20, 7:56 pm, "Alexey Smirnov" <alexey.smir... @gmail.comwrote :
          "Froefel" <hansdeschry... @gmail.comwrote in message
          >
          news:1184943375 .110840.252750@ n60g2000hse.goo glegroups.com.. .
          >
          >
          >
          Hi group,
          >
          I'm looking for some help on how to achieve the following in a
          gridview control that is based on an ObjectDataSourc e.
          The SelectMethod of the datasource returns a list of Customer objects.
          Each Customer object has a property "Notes".
          >
          When I display the list of customers in the gridview, I would like to
          provide a column that displays an Image associated with the Notes
          property. If the Notes property contains data I want to display a
          colored version of the image. When the Notes property doesn't contain
          data I want to display a grayed version of the image.
          Clicking an image should launch a URL to either view or enter notes.
          >
          A variation on this (for another column in the same grid) is the need
          to display one of several images or no image at all, based on the
          value of a property.
          If a customer's Status property = Yes, display a green image;
          If a customer's Status property = No, display a red image;
          If a customer's Status property = Maybe, display a yellow image;
          If a customer's Status property = Done, don't display an image;
          >
          This behavior is similar to Hotmail's classic display of the message
          icon in the first column, which changed based on whether a message is
          flagged read, unread, replied to, unknown sender, ...
          >
          Does anyone have any suggestions on how to implement this or can
          anyone point me to an article that explains this?
          >
          Thanks
          -- Hans
          >
          Hi, Hans
          >
          the easiest way is to have 4 images: yes.gif, no.gif, maybe.gif and done.gif
          and use a value of the Status to build a name of the image:
          >
          <asp:TemplateCo lumn>
          <ItemTemplate >
          <%#"<img src=""" & DataBinder.Eval (Container.Data Item, "Status") &
          ".gif"">"%>
          </ItemTemplate>
          </asp:TemplateCol umn>
          >
          another option is to make a method
          >
          public string getImage(object s)
          {
          if (s == "Yes") {
          return("<img=.. ..");
          >
          }
          ....
          }
          >
          and use it to get an image
          >
          <asp:TemplateCo lumn>
          <ItemTemplate >
          <%# getImage(Contai ner.DataItem, "Status")) %>
          </ItemTemplate>
          </asp:TemplateCol umn>
          >
          Hope this helps

            Comment

            • David Wier
              #4
              Re: Gridview and column with variable image

              Here's a code sample from ASPNEt101.com:
              http://aspnet101.com/aspnet101/aspnet/codesample.aspx?code=gvconditionalImages


              It's all done in the RowDatabound event

              David Wier
              http://aspnet101.com

              http://iWritePro.com - one click PDF/DocToHTML/RTFtoPDF

              "Froefel" <hansdeschryver @gmail.comwrote in message
              news:1184943375 .110840.252750@ n60g2000hse.goo glegroups.com.. .
              Hi group,
              >
              I'm looking for some help on how to achieve the following in a
              gridview control that is based on an ObjectDataSourc e.
              The SelectMethod of the datasource returns a list of Customer objects.
              Each Customer object has a property "Notes".
              >
              When I display the list of customers in the gridview, I would like to
              provide a column that displays an Image associated with the Notes
              property. If the Notes property contains data I want to display a
              colored version of the image. When the Notes property doesn't contain
              data I want to display a grayed version of the image.
              Clicking an image should launch a URL to either view or enter notes.
              >
              A variation on this (for another column in the same grid) is the need
              to display one of several images or no image at all, based on the
              value of a property.
              If a customer's Status property = Yes, display a green image;
              If a customer's Status property = No, display a red image;
              If a customer's Status property = Maybe, display a yellow image;
              If a customer's Status property = Done, don't display an image;
              >
              This behavior is similar to Hotmail's classic display of the message
              icon in the first column, which changed based on whether a message is
              flagged read, unread, replied to, unknown sender, ...
              >
              Does anyone have any suggestions on how to implement this or can
              anyone point me to an article that explains this?
              >
              Thanks
              -- Hans
              >

                Comment

                Previous template Next
                Working...