Knockout optionsText is encoded

Question

I am trying to create an html hierarchical select based on this solution and using knockout

However, knockout encodes the string value i return.

How can i decode the text returned from the function?

Html:

<select data-bind="options: items, optionsText: getOptionText"></select>

Javascript:

var viewModel = {
    items: ko.observableArray([
        { Text: "Item 1", level: 1 },
        { Text: "Item 2", level: 2 },
        { Text: "Item 3", level: 3 },
        { Text: "Item 4", level: 4 }
    ]),
    getOptionText: function(data) {
        var value = "";
        for (var i = 1; i <= (data.level - 1) * 2; i++) {
            value += "&nbsp;";
        }
        value += data.Text;
        return value;
    }
};
ko.applyBindings(viewModel)

php-dev · Accepted Answer · 2019-01-28T15:07:31.160

10

Replace your " " with "\xA0" (The hexadecimal representation of the Non-Breaking Space character.)

edited Jan 28 '19 at 15:07

answered Jan 21 '14 at 13:21

php-dev

6,998
4
24
38

score 1 · Answer 2 · answered Jan 21 '14 at 13:07

1

The answer is to use the actual character for a space instead of an HTML entity. To get a non-breaking space type Alt+255. Just do this in place of the   in your code. It will look like a normal space but will display as a non-breaking space:

Live example: http://jsfiddle.net/jLbct/1/

answered Jan 21 '14 at 13:07

Jamiec

133,658
13
134
193

1

You might consider setting it to a constant variable so someone reading the code later is aware that it's not just a regular space. – LameCoder Jan 21 '14 at 15:12
For that reason I might be tempted to go with the other answer which uses `\xA0` as it also works and is more visible to other coders! – Jamiec Jan 21 '14 at 15:14
@Jameic: Yes, your solution works, but i think the one with `\xA0` is more suitable – Catalin Jan 21 '14 at 15:16

Knockout optionsText is encoded

2 Answers2