This is a migrated thread and some comments may be shown as answers.

Setting the DropDownWidth on onItemsRequested

6 Answers 79 Views
ComboBox
This is a migrated thread and some comments may be shown as answers.
Annie
Top achievements
Rank 1
Annie asked on 07 Oct 2010, 07:37 PM
Hello,

We would like to make the drop down area wider in order to show the full text of the combo box items.

I have the following code:  (The combo is set to 250px width)

 

 

 

protected void LstAgency_ItemsRequested(object sender, RadComboBoxItemsRequestedEventArgs e)
    {
        LstAgency.Items.Clear();
  
        if (e.Context["CustomText"].ToString().Length >= 2)
        {
            data = APIHelper.GetCompanies(e.Context["CustomText"].ToString());
  
            ShowSmartCombo(e, LstAgency, data, "Name");
        }
  
        // We want to show the drop down to the width of the longest company name. 
        // Use approx. 3 px per character. iLongestName * 3
        LstAgency.DropDownWidth = new Unit(800, UnitType.Pixel);
    }

But the DropDownWidth does not change. I have stepped through the code to make sure it's setting the DropDownWidth, but nothing happening.

Is it because we can't change the width of the drop down in the onItemRequested event?

Thanks,
Annie

 

6 Answers, 1 is accepted

Sort by
0
Cori
Top achievements
Rank 2
answered on 07 Oct 2010, 08:34 PM
Hello Annie,

That is correct, you can't change the control's DropDownWidth because the ItemsRequested is called using a callback, not a postback. So you'll need to change the DropDownWidth in the client-side event of ItemRequested. Like so:

function OnClientItemsRequested(sender, eventArgs)
 {
   $telerik.$(sender.get_dropDownElement()).width("800px");
 }

I hope that helps.
0
Annie
Top achievements
Rank 1
answered on 07 Oct 2010, 09:31 PM
Hi Cory,

Thank you for the prompt reply.  But the code is not working fo rme.

My RadComboBox Markup:

function

 

OnClientItemsRequested(sender, e) {

 

$telerik.$(sender.get_dropDownElement()).width(

"1200px");

 

}


<

 

telerik:RadComboBox MarkFirstMatch="true" ID="LstAdvertisers" runat="server" Width="297px"

 

 

Height="200px" AllowCustomText="true" ShowToggleImage="True" ShowMoreResultsBox="false"

 

 

EnableLoadOnDemand="true"

 

 

EnableAjaxSkinRendering="true"

 

 

AutoPostBack="true"

 

 

OnClientItemsRequested="OnClientItemsRequested"

 

 

OnClientItemsRequesting="OnClientItemsRequesting"

 

 

OnItemsRequested="LstAdvertisers_ItemsRequested"

 

 

OnSelectedIndexChanged="LstAdvertisers_SelectedIndexChanged">

 

 

</telerik:RadComboBox>

I stepped through the code, and the code is executing, but the size of the drop down is not changing.
Any thoughts?

Thank you so much!

Annie

 

0
Shinu
Top achievements
Rank 1
answered on 08 Oct 2010, 01:40 PM
Hello,


I found a code library regarding how to set the DropDownWidth according to content. I hope this would help you in achieving the required functionality.
Dynamic Dropdown width


-Shinu.
0
Annie
Top achievements
Rank 1
answered on 08 Oct 2010, 01:44 PM
HI Shinu,

Thanks for the reply, but the link is not working.   Could you please see if you can find a working link for me?

Thank you so much,

Annie
0
Annie
Top achievements
Rank 1
answered on 08 Oct 2010, 03:14 PM
I've also tried the suggestion in this post :

http://www.telerik.com/community/forums/aspnet/combobox/dynamic-width-for-combo-box.aspx

But once the items are populated from the server, the combo box is set back to the original width.

I solved the issue by overwritting the default style sheet:

 

/* OT 2310 Overwrite default style to enable the dynamic width of the drop down box */

 

 

.rcbSlide div

 

{

 

min-width: 297px !important;

 

 

max-width: 2000px !important;

 

 

width: auto !important;

 

 

white-space:nowrap;

 

}

 

.rcbWidth

 

{

 

white-space:nowrap !important;

 

 

width : 98% !important;

 

}

 

.rcbList

 

{

 

position: relative !important;

 

 

width: auto !important;

 

}


Annie
0
Cori
Top achievements
Rank 2
answered on 12 Oct 2010, 03:49 PM
Here is the correct link for the Dynamic DropDownWidth code library:

http://www.telerik.com/community/code-library/aspnet-ajax/combobox/dynamic-dropdown-width.aspx
Tags
ComboBox
Asked by
Annie
Top achievements
Rank 1
Answers by
Cori
Top achievements
Rank 2
Annie
Top achievements
Rank 1
Shinu
Top achievements
Rank 1
Share this question
or