none
how to display pictures in Drop Down menu? RRS feed

  • Question

  • I've created a custome list that includes a column called (Project Status) of type Choice--> drop down menu
    the choices are In progress, Complete, Not Started

    I want to do either one of the following:
    In the list view, instead of getting the status wordings, I want to show a representative image (e.g. Green pic for Complete, Yellow  for in progress, Red for not started)

    or I want to display the images in the list when i add a new item.

    what is the easiest way please?
    • Moved by Mike Walsh FIN Tuesday, February 23, 2010 11:59 AM customization not programming (From:SharePoint - Development and Programming (pre-SharePoint 2010))
    Tuesday, February 23, 2010 10:47 AM

Answers

  • Hi Aysha,

    This is excellent. You have followed correct steps and let me tell you that even I have not done this before.

    First of all, the way I did it.

    1. I added the pictures into my picture library (since they will be the same for all list items)
    2. Created a new column in list with type set as picture
    3. Created a itemAdded Event Handler feature for the list (it is piece of code that executes when a new item is added to list)
    4. Inside code I found out what the status (my choice column) value was and based on that I was passing the relevant image to the new column created in step 2.

    Example
    if properties.listItem("MYStatusCOlumn").toString = "Started" Then
        dim abc as SPFieldUrlValue
        abc.Discription = "project started"
        abc.Url = "my picture library url"
      
        properties.ListItem("mycolumnfromstep2") = abc
        properties.ListItem.Update()
    End if

    Having not tried your method, I need to give it a go before I can help you out. In the meantime, please spend some time on the following which you might find useful.

    http://techtrainingnotes.blogspot.com/2009/04/sharepoint-displaying-pictures-and.html
    http://social.msdn.microsoft.com/Forums/en-US/sharepointcustomization/thread/712bd76b-ca7f-4590-9dac-314a4abdc368/
    http://blog.12thwave.com/?p=23

    Thanks,
    Wednesday, February 24, 2010 10:05 AM

All replies

  • Tuesday, February 23, 2010 11:07 AM
  • Hi,

    Did you get anywhere with the previous suggestion? I think this should be done programmatically.

    Let all of us know.

    Thanks,

    Tuesday, February 23, 2010 1:36 PM
  • Thank you Yura, the solution looks promesing but i'm not looking for a ready made solution.

    Yes, .Net Frenzy it needs small programming, and this is what I did but i got an error.

    I've uploaded the images (.jpg) in a document library: in progress.jpg, completed.jpg, not started.jpg

    In my custom list, I've created a column of type choice, the values are (in progress, Completed, Not started)

    Then, I've added 3 items in the list, each record assigned a different status value, I mean
    first record--> in progress
    second record --> completed
    theird record --> not started

    Now I opend SharePoint designer (2007) and I want to do some  modification to the view to show the images instead of the words

    I right click on the view--> Convert to XSLT Data View

    I clicked on the first record status the one that says in progress and choose format it as Picture. ( this changes the words to be a broken images)

    Then I clicked on the image and changed the image code to be:

    <img border="0" src=http://portal/it/test/Shared_x0020_Documents/"{@choice}".jpg />

    then when i click on any where, my data disappear from the view and i got this error in stead 

    this webpart doesn't have a valid XSLT stylesheet
    Wednesday, February 24, 2010 7:32 AM
  • Hi Aysha,

    This is excellent. You have followed correct steps and let me tell you that even I have not done this before.

    First of all, the way I did it.

    1. I added the pictures into my picture library (since they will be the same for all list items)
    2. Created a new column in list with type set as picture
    3. Created a itemAdded Event Handler feature for the list (it is piece of code that executes when a new item is added to list)
    4. Inside code I found out what the status (my choice column) value was and based on that I was passing the relevant image to the new column created in step 2.

    Example
    if properties.listItem("MYStatusCOlumn").toString = "Started" Then
        dim abc as SPFieldUrlValue
        abc.Discription = "project started"
        abc.Url = "my picture library url"
      
        properties.ListItem("mycolumnfromstep2") = abc
        properties.ListItem.Update()
    End if

    Having not tried your method, I need to give it a go before I can help you out. In the meantime, please spend some time on the following which you might find useful.

    http://techtrainingnotes.blogspot.com/2009/04/sharepoint-displaying-pictures-and.html
    http://social.msdn.microsoft.com/Forums/en-US/sharepointcustomization/thread/712bd76b-ca7f-4590-9dac-314a4abdc368/
    http://blog.12thwave.com/?p=23

    Thanks,
    Wednesday, February 24, 2010 10:05 AM
  • AYSHA DO YOU NEED HELP WITH ANYTHING?
    Tuesday, March 2, 2010 2:47 AM
  • Thank you Youssef, in fact I'm still struggling with it. Can you try my solution and let me know what you will come up with?

    many thanks
    Saturday, March 6, 2010 6:58 AM
  •  

    Well I assume that you're tagging about a dropdown box for a web browser. If that assumption is true, and if you're willing to use Javascript, then you could use something like the Javascript Custom Dropdown v2.1 

    Tuesday, March 9, 2010 2:16 AM
  • Awesome tool
    Ashish Kanoongo, MCP, MCSD, MCTS
    Tuesday, March 9, 2010 2:21 AM
  • AYSHA.....IS EVERYTHING ALLRIGHT?
    Wednesday, March 10, 2010 4:33 AM
  • Great suggestion if you have the budget, I can't even get my Admin to install the default "Status List" that came in the "box".

    This should not be this hard, all I want is three images in a drop down, Red, Green, and Yellow flags.

    Thanks

    Jeff

    Wednesday, November 13, 2013 5:21 PM
  • Im sure it can but I unfortunatly am a PM and my programing skills are limited at best.  If someone has some code I could use I would be willing to try.

    Thanks

    Jeff

    Wednesday, November 13, 2013 5:22 PM