How cound we display the whole content when the text is too long in dropdown list of igCombo | Infragistics Forums

State See Verified Answer
Replies 9 replies
Subscribers 13 subscribers
Views 1982780 views
Users 0 members are here

igCombo

210

How cound we display the whole content when the text is too long in dropdown list of igCombo

Jeffrey Chen posted over 12 years ago

Hi there,

How could we display the whole content when the text is too long in dropdown list of igCombo?

See the figure below:

Top Replies

23953

Offline Martin Pavlov posted over 12 years ago in reply to Jeffrey Chen +1 verified
Hi Jeffrey, Try with these CSS rules. Code Snippet < style > .ui-igcombo-list { overflow-y : auto!important ; } .ui-igcombo...view reply »

Parents

23953

Offline Martin Pavlov posted over 12 years ago
Hi Jeffrey,

igCombo has white-space: nowrap; CSS rule. In order to override it use these CSS rules (border-bottom rules is not necessary. I put it to make a distinction between combo items.):

Code Snippet

<style>

    .ui-igcombo-list ul > li

    {

        white-space: normal!important;

        border-bottom: 1px solid black!important;

    }

</style>

Best regards,
Martin Pavlov
Infragistics, Inc.
Cancel
Reply

Cancel

Reply

175

Offline Tom Sprows posted over 12 years ago in reply to Martin Pavlov

Hi Martin,

Can we show tooltip on hovering over any combo box list item?

Regards.
Cancel
Reply

Cancel

Children

23953

Offline Martin Pavlov posted over 12 years ago in reply to Tom Sprows
Hi Peter,

You can achieve this by using igCombo.itemTemplate option. The idea is to wrap the text into SPAN element and use its title attribute to enable tooltips.

Here is an example code:

Code Snippet

$.ig.loader(function () {

    $("#combo").igCombo({

        valueKey: "Name",

        textKey: "Name",

        width: "100px",

        itemTemplate: "<span title=\"${Name}\">${Name}</span>",

        dataSource: adventureWorks

    });

});

Hope this helps,
Martin Pavlov
Infragistics, Inc.
Cancel
Reply

Cancel