Select object - colored list

[yvesf]

Hello,


I would like to create a select objet having values with a background color.
Let's say, I have a Select object named select_color having 4 values blue, green, red and yellow.
Will it be possible to have the value blue in white font with a blue background behind in the list, idem for the others colors.
It is available in many places in the product itself.

Capture.PNG

My understanding, it's that it's defined in the css as below

Code: Select all

.nu_browse					{background-color : #8de2e2 !important}
.nu_button					{background-color : #98AFC7 !important}
.nu_display					{background-color : #c79a63 !important}
.nu_dropdown				{background-color : #7bce98 !important}
.nu_html					{background-color : #df7bb9 !important}
.nu_contentbox				{background-color : #43cbdd !important}
.nu_editor					{background-color : #918fd4 !important}
.nu_input					{background-color : #8db3dd !important}
.nu_image					{background-color : #c3998a !important}
.nu_word					{background-color : #68c994 !important}
.nu_lookup					{background-color : #EDDA74 !important}
.nu_subform					{background-color : #f3b6b1 !important}
.nu_run						{background-color : #cbc287 !important}
.nu_textarea				{background-color : #babedb !important}
.nu_select					{background-color : #caa5f6 !important}
.nu_calc					{background-color : #B6B6B4 !important}

is it possible then to instantiate my select object "select_color" like it is done here ?
Many thx,

Yves

[kev1n]

Declare CSS styles in your form's "Style" section like:

Code: Select all

.color-red {
  color: red;
}

Then, to set the above class of a select option that has the value "123":

Code: Select all

$("#your_select_id_here").find('option[value="123"]').addClass('color-red');

(Untested)

[yvesf]

It appears modified in the select list with a small modification

Code: Select all

$("#your_select_id_here option[value='LEN']").addClass('color-red');

But I would like to keep this color when I have selected the value also.

Video_2023-07-26_134856.gif

Many thx,

Yves