Search code examples
selectcomboboxiconssapui5dropdown

Select with custom icon in SAPUI5

Is posible make a select that shows a custom icon? or we only can use SAP icons?

I'm trying this:

enter image description here

I want a dropdown like this and next to the name country that we can see the flag of each country. Is posible for a dropdown?

this is the view:

<m:Label/>
<m:Select items="{ path: 'listcountries>/countrySet' }">
        <c:ListItem key="{listcountries>Land}" text="{listcountries>Landx}" icon="images/{Land}.png"/>
</m:Select>

{Land} is the same value that the name of the each picture.

and this the route of the pictures: click

thank you!

Solution

  • Yes, it's possible with sap.m.Select. Here is a sample https://openui5.hana.ondemand.com/entity/sap.m.Select/sample/sap.m.sample.SelectWithIcons

    <Select>
    <core:ListItem key="item1" text="Text 1" icon="./path/to/icon1"/>
    <core:ListItem key="item2" text="Text 2" icon="./path/to/icon2"/>
</Select>

    Here is a live example https://codepen.io/pdimov/pen/gORgdBm