Add a class to searchbuilder dropdown data
Add a class to searchbuilder dropdown data
ECEGROUPE
Posts: 77Questions: 28Answers: 1
Is it possible to add a class to the dropdown data used by searchbuilder ?
Case for exemple : https://datatables.net/extensions/searchbuilder/examples/initialisation/simple.html
In this exemple, when you inspect the searchbuilder
we have this code
<div class="dtsb-criteria">
<select class="dtsb-data dtsb-dropDown">
<option value="" disabled="" selected="" hidden="">Data</option>
<option value="0" class="dtsb-option dtsb-notItalic">Name</option>
<option value="1" class="dtsb-option dtsb-notItalic">Position</option>
<option value="2" class="dtsb-option dtsb-notItalic">Office</option>
<option value="3" class="dtsb-option dtsb-notItalic">Age</option>
<option value="4" class="dtsb-option dtsb-notItalic">Start Date</option>
<option value="5" class="dtsb-option dtsb-notItalic">Salary</option>
</select>
</div>
What i want is add myclass
<option value="2" class="dtsb-option dtsb-notItalic myclass">Office</option>
Additional information : Why i want to do that ?
I want to add my class here to change the background color of specific option field. I know i can do it with css selector like this :
#example_wrapper > div.dtsb-searchBuilder > div.dtsb-group > div.dtsb-criteria > select.dtsb-data.dtsb-dropDown > option:nth-child(4) { background-color : red }
but i use multiple html pages / datatables but only one css, if i don't want to use multiple css for each datatables, i need something like this :
.myclass { background-color : red }
Thx for your help
Answers
Yes, you can use:
http://live.datatables.net/vixicoxo/1/edit
Allan
Thank alan,
i have modified your exemple, this almost work -> http://live.datatables.net/lidutehe/1/edit
what i want is the class to be apply to only ertain field option, for exemple only on the field name and office, is it possible ?
Do you mean you want a specific item in the dropdown list to have specific styling? Or to have styling when that option is selected?
Allan
This :
Exemple : http://live.datatables.net/lidutehe/4/
This work BUT i want to do it with a class selector and not nth-child() because i have multiple tables and it's never the same columns / different order