Colour of Placeholder for a Select Statement - When Select Statement is Disabled

Wappler General
#1

So I have a select statement with options taken from the database, and I want a placeholder. So I can use the trick of:

<select required 
 dmx-bind:disabled="view_edit_mode.value=='view'"
 dmx-bind:options="get_age_ranges.data.get_age_ranges">
	<option value="" selected>Age range</option>
</select>

which gives me my placeholder “Age range”.

But… I want the placeholder to be a muted colour both when selected, and when selected and the select statement is disabled.

So to mute the placeholder when the select statement is not disabled, I can use:

select:invalid {color: my-muted-colour;}

But how can I make the disabled select statement show the normal colour when a value from the database is selected, but the muted colour when the placeholder is selected?

  • Can CSS do it? I can’t find a solution on the internet
  • Can a dmx feature do it?
  • Or javascript?

Best wishes,
Antony.