Combo box selected item formatting

Webix JS
#1

Created a snippet using the latest online version. When you have some inline HTML formatting (non-breaking spaces in this case), the drop-down issue formats correctly (indenting in this case), but after selecting the item, the formatting of the selected item is raw, showing, in this case the non-breaking space characters as raw tokens, not as simply a space.

https://snippet.webix.com/f87y71vr

#2

Hello,
Try to use template and css for rendering the row in the combo correctly.
Example: https://snippet.webix.com/awluuf08

#3

That almost works. Problem is the hierarchical formatting in the menu is gone, and the value in the selected combo has the formatting. The drop-down no longer has the formatting, which is where it’s actually critical, not in the selected box.

The menu would Ideally show

Banana


 Green Banana


Apple

and the selected both either



 Green Banana


or
Green Banana

To Clarify, the menu now shows

Banana
Green Banana
Apple

and the selected box



  Green Banana

It still all seems basically just inconsistent.

#4

Hello @dhockley,
As I correctly understood you. You want to make like this

Banana
      Green Banana
Apple

and it will be in combo and pop up too.
So here is an example: https://snippet.webix.com/eqbw4tl9

#5

or, as another solution, you can use template function

 template:function(obj){
          var replaced = obj.value.replace(/ /g, '  ');
          return replaced;
        }

Example: https://snippet.webix.com/m4k4vfsu