This visualizer component uses the jQuey UI autocomplete widget. It can be applied to choices and leaf enumerations.

Setting it up on a choice node:

In the XUI-Editor go to the appropriate node and create a XUI Component if necessary. Select "Style" > "Choice" and set the "Visualizer type" to advancedComboBox. The component itself will be configured with a HTML escaped JSON String in the NLS file. For Example:

/rootNode/choice/fahrt%label%choice={"label"&co;"Lokale Verteilfahrt", "desc"&co;"Beschreibung", "imgClass"&co;"lokaleVerteilfahrt"}

This NLS Entry for one element will be rendered as follow:

advancedCombobox.png

For layouting the widget there are several CSS Classes applied to the component to format it to your needs.

Setting it up on a leaf enumeration:

In the XUI-Editor go to the appropriate node and create a XUI Component if necessary. Select "Style" > "Leaf" and set the "Visualizer type" to advancedComboBox. The component can be configured by specifying a configurationString in the field "configurationString" in the following format:

valueOnSelect=text,display=id-text 

following key-value properties are allowed for codeset enumeration:

For layouting the widget there are several CSS Classes applied to the component to format it to your needs. To apply images to a single entry there is a div rendered with a special class applied: [codesetname]_[id]