Jump to content
  • 0

Dropdown for Color Choice


johnnutt

Question

Hello, I have a dropdown that lists color names using text like red, light blue etc.  I would like to include the actual color or just show the color choices without the text.  I could also just use a list box of color choices as well.  Has anyone done this?

Link to comment
Share on other sites

7 answers to this question

Recommended Posts

  • 0

You can use emojis. Would you like the values to be actual colors, as well, instead of text? You can use the emojis for the values, as well, but I wouldn't really recommend that, you might have a hard time if you're gonna use it on other things, but, if not, feel free to do so.
image.png.4730416f05b24f03f49c2c25be3d0caa.png
 

image.png.1c4ff228ed6d5aa17faf5f7d27757acb.png

Link to comment
Share on other sites

  • 0
1 hour ago, johnnutt said:

Thanks for the reply but my colors are like "hardrock maple" or "slate gray" so they're real colors based on jpegs.  I guess I need to show the jpeg color in the dropdown or listbox.  Any other ideas use java etc?

 

ahh, I don't know, I believe only radio buttons accept images
 

image.png.c2e2013f68c77f7a6eef486ef530ae8c.png

 

use img tag for the display . i.e. <img src="https://multimedia.3m.com/mws/media/1484762F/3630-61-slategray-swatch.jpg" alt="test" width="50px"/>

image.png

Link to comment
Share on other sites

  • 0

that totally works!! I used the same color just for testing.  But you're right that it only works with radio selection.  I have 25 colors so either it rolls off page to the right or down.  Maybe formatting them into a 5x5 grid is a bridge too far?

 

image.thumb.png.9ad92d76af895c033b595a756764c061.png

Link to comment
Share on other sites

  • 0
1 hour ago, johnnutt said:

that totally works!! I used the same color just for testing.  But you're right that it only works with radio selection.  I have 25 colors so either it rolls off page to the right or down.  Maybe formatting them into a 5x5 grid is a bridge too far?

 

image.thumb.png.9ad92d76af895c033b595a756764c061.png

add <br/> to the display where you want it to cut off (i.e. <img src="https://multimedia.3m.com/mws/media/1484762F/3630-61-slategray-swatch.jpg" alt="test" width="50px"/> <br/>)

 

image.png.2fd0b9d05d9b9c752b5d11e64c42103d.png

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
×
×
  • Create New...