+ Start a Discussion
dsh210@lehigh.edudsh210@lehigh.edu 

Style SelectListOptions

Hey All,

 

I have a requirement that I change the style of certain options in picklists (or multiselects) based on certain criteria. I have been struggling with how to style these elements in visualforce. I tried injecting some html/css into the label part of the selectoption, but I discovered that the <option> tag in HTML cannot have child elements. Ideally I would like to add a class to that <option> tag that visualforce renders my selectoptions as. A few requirements I have:

 

I must use <apex:selectOptions> because I have a dynamic number of options.

I will also have a dynamic number of these selectLists, so using an id will not work.

 

Anyone have any suggestions on this area?

 

 

P.S. This is what I am shooting for:

SelectList

osamanosaman

Use javaScript to change the color on onchange event.

dsh210@lehigh.edudsh210@lehigh.edu

Thanks, but I am not quite sure how this would help. The idea is to highlight the option as currently unavailable, while still leaving it selectable if the user whishes to override the suggestion. First, in order to initiate an onchange, I would need to call out the element using a document.getElementById, which I stated is difficult (although possible through some javascript hacking). Second, by using an onChange event the change will be applied only after the user has selected an invalid option. This does not help when I need the user to see that options are invalid before selecting them.

 

I do appreciate the suggestion though, it is just something I have already considered. I would like to do this with as little impact outside of APEX as possible. If necessary though, I am okay with implementing some javascript 'hacks'.