I would like to apply some HTML styling to the options. In particular, I need to left align the options, and apply colours, and they may well be some other things I need to do.
I did try and use the “templateSelection” callback function approach, however it looks as though everything you pass back is treated as text (not HTML).
Any help greatly appreciated.
Be careful: templateSelection styles the selected option that is displayed after the dropdown is closed. templateResult styles the options displayed in the dropdown.
If your templateResult callback returns a jQuery object (or an equivalent JavaScript Node) instead of a plain text string, you can create whatever styling you want.See the example here (note how the HTML string is wrapped in the jQuery $() function, converting the HTML text into a jQuery object).
I have an example on CodePen that illustrates styling the options to highlight the matching text. (For example, try typing “li” into the search field.)
Thanks for your email.
Now working thanks - my apologies for not seeing this in the documentation.
Regards
Geoff Olding