Is there anyway to highlight fields

  • 0
  • 1
  • Question
  • Updated 3 years ago
  • Answered

Certain fields on my form relate to different parts of the process.  I was wondering if there was any way to highlight particular fields in colors so that as someone is trying to fill in the fields they will know that these 3 fields colored green relate to x and red relates to Y.  I know that you can have colors on reports and set up formulas so that if blank field has blank value show in red but that is different.  I just want the field name to be highlighted in a color.  

Photo of Data

Data

  • 0 Points

Posted 3 years ago

  • 0
  • 1
Photo of Ⲇanom the ultimate (Dan Diebolt)

Ⲇanom the ultimate (Dan Diebolt), Champion

  • 30,224 Points 20k badge 2x thumb
Use the image onload technique with the code similar to what is in this pastie:

Pastie Database
https://haversineconsulting.quickbase.com/db/bgcwm2m4g?a=dr&rid=506


See attached screenshot.

The code in the pastie assumes you are using labels on the left of your fields. If you are using labels above the fields you will have to change the jQuery selectors slightly.

Notes:

(1) CSS properties with a hyphen (eg background-color) are converted to camel case (backgroundColor) when supplied as jQuery CSS keys.

(2) You will have to hunt around for the appropriate colors that are muted but provided enough of a clue to your users what a specific color indicates. Maybe include a color legend on your form.

(3) some people are color blind so test your color choices among your users:

http://www.color-blindness.com/color-blindness-tests/


(4) There are a lot of color picker and pallet selection utilities on the web. I am old school so I use color swatches from Sherwin Williams for all my web work:

http://www.sherwin-williams.com/wcm/idc/groups/public/@swpublic/@sherwin-williams/@content/documents...


My screenshot used Glimmer:

6476 Glimmer 224 231 226

Glimmer is definitely my favorite color.

Here is a great color picking tool (there are hundreds of these types of utilities):

https://color.adobe.com/