[CLOSED] ComboBox didn't show all the text

[leon_tang]

Hi:

I have a ComboBox on the page and bind it with a array as data source. I have a issue that when the text in the combo box is too long. When you drop down the list, the items in the list will not show full text. I attached the screen shoot. I am wondering whether there is way I can add a horiz scroll bar on the bottom of the list. Thank you

[Daniil]

Hi,

I can see a possibility to set up scrolling for each item.

<ext:ComboBox runat="server" ListClass="my-list">

<style type="text/css">
    .my-list .x-combo-list-item {
        overflow-x: scroll;
        text-overflow: normal;
    }
</style>

But it will cases horizontal scrollbar to be appeared for each item independently it is required or not. So, it doesn't look so well.

What about to just increase list width?

<ext:ComboBox runat="server" ListWidth="300">

[leon_tang]

Hi,

I can see a possibility to set up scrolling for each item.

<ext:ComboBox runat="server" ListClass="my-list">

<style type="text/css">
    .my-list .x-combo-list-item {
        overflow-x: scroll;
        text-overflow: normal;
    }
</style>

But it will cases horizontal scrollbar to be appeared for each item independently it is required or not. So, it doesn't look so well.

What about to just increase list width?

<ext:ComboBox runat="server" ListWidth="300">

That's the issue for width. Basically we have this issue when we squeeze the browser so I think we can not increase the width.
How about tooltips? could we add a tooltips which can show full length text for each item in the list?

[Daniil]

Yes, ToolTip can be a solution.
http://forums.ext.net/showthread.php...ll=1#post61277

[leon_tang]

Yes, ToolTip can be a solution.
http://forums.ext.net/showthread.php...ll=1#post61277

I try the tooltips control but it looks doesn't work
the markup is:

<ext:ComboBox ID="ComboBoxItemList" runat="server" SelectedIndex="0" Editable="false"
    StoreID="StoreTaskItemList" DisplayField="Name" ValueField="Id" TabIndex="2"
    TypeAhead="True" TriggerAction="All">
    <Listeners>
        <Select Fn="forecast.taskItemChange" Delay="1"></Select>
        <AfterRender Handler="this.doQuery('', true);" />
    </Listeners>
</ext:ComboBox>
<ext:ToolTip ID="ToolTip1" runat="server" Target="={#{ComboBoxItemList}.list}" Delegate=".x-combo-list-item"
    TrackMouse="true">
    <Listeners>
        <Show Handler="this.body.update(this.triggerElement.innerHTML);" />
    </Listeners>
</ext:ToolTip>

but when I drill down the list in combo box, nothing happend

[Daniil]

There is

LazyInit="false"

in my example.

Please set up.

It the issue still persists then please provide a full test case to reproduce the problem.

[leon_tang]

There is

LazyInit="false"

in my example.

Please set up.

It the issue still persists then please provide a full test case to reproduce the problem.

That works, thank you