RadcomboBox height rendering issues

[swordfish450]

I have an issue with a Radcombobox. I am trying to set the height of the radcombobox on ClientSelectedIndexChanged, but I am getting a rendering issue and I cannot see where the problem is.

 Below, you will find my code;

 CSS:

div.RadComboBox_Windows7 .rcbInputCell INPUT.rcbInput

{

height: 37px;

}

ASPX:

<telerik:RadComboBox ID="RCB_Test" runat="server" Width="340px" OnClientSelectedIndexChanged="OnClientSelectedIndexChangedHandler">

<Items>

<telerik:RadComboBoxItem runat="server" Text="Testing please" Value="Testing please" />

<telerik:RadComboBoxItem runat="server" Text="Testing please" Value="Testing please" />

<telerik:RadComboBoxItem runat="server" Text="Testing please" Value="Testing please" />

</Items>

</telerik:RadComboBox>

 

JavaScript:

function OnClientSelectedIndexChangedHandler(sender, eventArgs) {

var item = sender.get_inputDomElement();

item.style.height = "37px";

 

I have also attached an image of the problem.

 

Any help would be appreciated.

}

 

 

[Magdalena]

Hello,

RadComboBox in classic render mode uses sprite images to display backgrounds and borders in all skins that have rounded borders and gradients. The reason is supporting the control also in old browser. When you set bigger height of the control, there are visible other parts of the control. We recommend you to use lightweight render mode for the purpose.

<telerik:RadComboBox RenderMode="Lightweight" ...>

Regards,
Magdalena
Telerik

 

 

[swordfish450]

Hey Magdelana,

 Sorry for the delay.

That did solve the rendering problem, so thank you for that.

However, I am still not able to get the RadComboBox to expand to height I have set. It seems to set the height within the RadComboBox, but not the RadComboBox itself, which I am trying to expand.  

Do you see anything else that I am doing wrong?

Thank you for your time.

[Magdalena]

Hi,

The following CSS should customize the height of the lightweight ComboBox:

html .RadComboBox .rcbInput {
    height: ... ;
}

Regards,
Magdalena
Telerik

 

 

[swordfish450]

Hey Magdalena,

I have tried implementing your solution, but it does not seem to have the right effect on my RadComboBox.

Upon selecting a list item from the RadComboBox, the text is now out of the RadComboBox based on the height set.

What I want is to set the height of the RadComboBox, not the text in the RadComboBox. I am basically trying to find a solution when I have very long text and upon selection, how I can set the height and in some way make multiple lines in case the text is longer than the width of the RadComboBox.

Here is my ComboBox:

<table> 

<tr>

<td>

<telerik:RadComboBox ID="RCB_BillOfMotherMaterialNumber" runat="server" RenderMode="Lightweight" Skin="Windows7" AppendDataBoundItems="true" Filter="Contains" Width="340px" MarkFirstMatch="True" OnSelectedIndexChanged="RCB_BillOfMotherMaterialNumber_SelectedIndexChanged" AutoPostBack="true">

<Items>

<telerik:RadComboBoxItem runat="server" Text="" Value="" />

<telerik:RadComboBoxItem runat="server" Text="Yes" Value="Yes" />

<telerik:RadComboBoxItem runat="server" Text="No" Value="No" />

</Items>

</telerik:RadComboBox>

</td>

</table>

I hope my explanation clarifies what I am trying to do.

 

Regards,

Sabri

[Magdalena]

Hi,

As the text in RadComboBox is rendered in an <input> DOM element, it is not possible to wrap it to a next line.

Regards,
Magdalena
Telerik