1

I am trying to create a dropdown list with html encoded options in knockout js using options binding.

How can i decode the text returned from the function binded to the optionsText binding.

<select data-bind="options: items, optionsText: function(item){ return "decoded text"}"></select>

In general, I need a function that take a encoded html string and returns the decoded text.

i.e. the function takes something like

blah blah balh <sup>TM</sup>

and return

blah blah blah ™

superrehtard
  • 118
  • 1
  • 8

1 Answers1

2

This will not be possible. An option tag is not permitted to have other tags as content, only "Normal character data". This does mean you can use entities, e.g. &#8482; or &trade; (which renders as "™"), which should work for your specific example.

For completeness sake, for the Knockout part, if you were to try what you're after, you have two options:

  • utilize the foreach binding and create your own option elements with html bound contents (as opposed to text bound contents)
  • utilize the optionsAfterRender binding to tweak the rendered option elements (thanks to @CaseyWebb for noting this option in the comments)
Jeroen
  • 60,696
  • 40
  • 206
  • 339
  • You _can_ do this with the options binding using the `optionsAfterRender` binding (http://jsfiddle.net/CaseyWebb/uqmt8ora/), but as you stated, it's still invalid HTML. – caseyWebb Apr 29 '15 at 12:16
  • @CaseyWebb Ooh, didn't know about that binding, an interesting "option" :D. I've updated my answer to include it. – Jeroen Apr 29 '15 at 13:20