Hi,

I am trying to implement a load on demand scenario for a RadComboBox but am struggling to get it to work with multi columns and attributes.

Here is the code for my RadComboBox


And my code-behind:


The call to the PageMethod is working fine and the data is being populated in the RadComboBox, but the item template is ignored. All I am seeing is the returned Text property of the RadComboBoxItemData item. The documentation states that for attributes to work the way I am trying to use them, the RadComboBoxItem must call it's DataBind() method. Obviously this isn't happening on the web service request. Is there a way of doing this using LoadOnDemand and PageMethods/WebServices ?

Thanks

Hello TomL,

The page Templates are not supported when you use a web service to populate RadComboBox with data.
However you can use both LoadOnDemand and Templates at the same time - please take a look at this example.

Please let me know if you need further assistance.

Greetings,
Kalina
the Telerik team

Hi Kalina,

We were doing something similar, but we've run into a snag when an additional requirement was added.  Before I get to that, I wanted to point out that using the OnItemsRequested event can't be used as the list needs to be cleared with each request.  This is why we are using the web service or WCF.  The additional requirement that we have requires that we send additional data/parameters to the web service (i.e. max count and other filter information).  Is there a way that we can add items to the RadComboBoxContext object being sent to the web service?  The data that we need to send is stored in hidden fields on the form page.

Thanks,
Bill

Hello Bill,

Thank you for the clarification.

About clearing items on each request - you can clear items at server side with RadComboBox.Items.Clear() method, and at client side with the corresponding clearItems() method.

To pass additional information to the server you may follow this approach :

• On the client side, use OnClientItemsRequesting event to set attributes of the context object that is passed to the server along with the request for items:

• When the context object is passed to the Web service method you can retrieve the attributes like this:

More details you can find at example page attached.

Regards,
Kalina
the Telerik team

Hey Kalina,

I'll give that a try.  I did try using the RadComboBox.Items.Clear() method, but I think that it may be bugged as it didn't clear the combo box drop down length.  If I remember correctly the items seemed to be cleared, but the item count wasn't.  This resulted in a list that kept getting longer and longer, padded with empty/blank items.

Thanks,
Bill

Hello Bill,

Did you succeeded to implement the populating the RadComboBox with webservice and sending additional data to the server setting the context attributes?
Feel free to contact us if you need further assistance.

Kind regards,
Kalina
the Telerik team

Hello Kalina,

Hi Monalisa,

Hi Kalina,

Hello Monalisa,

Could you please compare your implementation with the online demo?

Hi Kalina,
I am trying to implement a load on demand scenario for a RadComboBox but am struggling to get it to work with multi columns and attributes.
Here is the code for my RadComboBox：
 <YDSC:ExRadComboBox ID="cmbFinanceEmpCode" runat="server" DropDownWidth="500px" Height="150px"
                    DataTextField="Name" DataValueField="GUID" EnableLoadOnDemand="True" ShowMoreResultsBox="true"
                    EnableVirtualScrolling="true" OnItemsRequested="cmbFinanceEmpCode_ItemsRequested"
                    OnClientKeyPressing="cmbFinanceEmpCode_ClientKeyPressing">
                    <HeaderTemplate>
                        <ul>
                            <li class="col1">姓名</li>
                            <li class="col2">唯一标识</li>
                            <li class="col3">部门</li>
                        </ul>
                    </HeaderTemplate>
                    <ItemTemplate>
                        <ul>
                            <li class="col1">
                                <%# DataBinder.Eval(Container.DataItem, "Name")%></li>
                            <li class="col2">
                                <%# DataBinder.Eval(Container.DataItem, "GUID")%></li>
                            <li class="col3">
                                <%# DataBinder.Eval(Container.DataItem, "DeptName")%></li>
                        </ul>
                    </ItemTemplate>
                </YDSC:ExRadComboBox>

  protected void cmbFinanceEmpCode_ItemsRequested(object sender, RadComboBoxItemsRequestedEventArgs e)
        {
            DataTable data = GetEmployeeInfoData(e.Text);

            int itemOffset = e.NumberOfItems;
            int endOffset = Math.Min(itemOffset + ItemsPerRequest, data.Rows.Count);
            e.EndOfItems = endOffset == data.Rows.Count;

  
            for (int i = itemOffset; i < endOffset; i++)
            {
                RadComboBoxItem item = new RadComboBoxItem(data.Rows[i]["Name"].ToString(), data.Rows[i]["GUID"].ToString());
                item.Attributes["DeptCode"] = data.Rows[i]["DeptCode"].ToString();
                item.Attributes["DeptName"] = data.Rows[i]["DeptName"].ToString();
                cmbFinanceEmpCode.Items.Add(item);         
            }
            e.Message = GetStatusMessage(endOffset, data.Rows.Count);
        }
    }

My problem similar the problem of TomL。You let us see examples。But the examples is not like my current situation。
My current situation：
1、I need Multi columns show
2、the number of Data is so huge。so I must Use "cmbFinanceEmpCode.Items.Add(item); "。but you examples  is use "RadComboBox.DataBind()"。if i do like the Example,the Efficiency is low

Thanks

Hi 潘 庭宝,


Please note that Container.DataItem is a runtime alias for the DataItem for this specific item in the databound control. That is why you need to databind the RadComboBoxItems.

To display the custom attribute of RadComboBoxItem you have to use 
 instead of

Please take a look at this online demo - the "Products" RadComboBox there is a good example for multicolumn layout with usage of custom attributes.


All the best,
Kalina
the Telerik team

hi,

Have any separate radcombo box like change skin combo box of Telerik demo page  ( http://demos.telerik.com/aspnet-ajax/combobox/examples/default/defaultcs.aspx ) ?
If yes tell me the radcombobox type.

Regards
Joseph.S

Hello Joseph,

I am afraid that the "Change Skin" control is not a RadComboBox but a skin managing control created for internal use.
You can achieve similar appearance using templates - please take a look at the second RadComboBox ("Multiple rows and columns") at this online demo.

All the best,
Kalina
the Telerik team

Hi,

Thanks for your reply. I'm able to create combo box like telerik demo page using Radmulti column control.

Regards
Joseph

Did this change since? I would like to use a webservice method with my multicolumn combobox and I want to know if it's currently supported

Hi,

I am afraid that Templates are not supported when you use a web service to populate RadComboBox with data.
You can use both Load On Demand and Templates if you implement a server-side ItemsRequested event handler - please take a look at this online demo.

Kind regards,
Kalina
the Telerik team

I have the following issue.
I wanted to use the radcombobox control and load the list on demand using a webservice based on user's search string.  I was hoping to use either of the two options below 
1.I have five fields that I can retrieve from the webservice and show it to the user using multi-column format. I was hoping to use a template for it but I guess that is not possible with a webservice? 

2. I want to display the first two fields (concatnated) in the dropdownlist (like firsname, lastname) but show the remaining three fields (like email address: xxx; jobtitle:aaa dpt: zzz) as tooltips when the user hover over the list in the drop down. Since the dropdown list is populated using the webservice (only two fields) how can i use the remaining three fields retruned by the webserice as a tooltip for each loaded items in the dropdown? I thought of putting all the five fields in the Text property of the radcomboboxdataitem but that is too bulky.

Any Ideas?

Thanks,

Hello Yoh,

The RadComboBox ItemTemplate is instantiated at server-side - that is why it is not possible to use it when you populate the control via Load On Demand from WebService.
I can suggest you use the RadComboBox Client Templates.

All the best,
Kalina
the Telerik team

I just about have a Load on Demand RadComboBox working with a multi-column template - with one problem.

The contents of my drop down refresh based on what the user types in - so as they type in letters the box only displays values that start with what they have typed.  This works fine - UNLESS what is typed returns only 1 result.  If they type letters in that result in only one result to be displayed in the drop down - then the dropdown instead shows NOTHING.  **With more testing what I have realized is that the 1 record is actually there - the drop down just doesn't expand down far enough to see it.  I have the same problem if the typed letters return 2 results only - the drop down opens far enough to display 1 item only, making it appears as if there is only 1 option - and the user has to scroll down to get to the 2nd.  Why when the results are only 1 or 2 rows is the dropdown now dropping down far enough to show them all??

My RadcomboBox is as follows:

And in my code behind:

 

It seems the drop-down is dropping down to the number of items MINUS 1 - so when there are only 1 or 2 items, this is not desired.  How can I change this??

 

 

Hello Brian,

Would you provide us with a screenshot, demonstrating the faced issue? In addition would you specify the used version and under which browser are you encountering the problem?

Kind regards,
Nencho
the Telerik team

This particular project is one of our older code bases - it uses the 2010.1.519.20 release of Telerik.Web.UI

I am attaching 3 images, designated with "3_items", "2_items", and "1_item" as part of their file names.  Notice that when there are 3 items in the drop down, you can only see 2 - rest assured the 3rd is there if I scroll down.  Same for the others - in the image titled radcombo_2_items there are indeed 2 items, but you can only see 1 - and in the radcombo_1_item there is actually an item, but you can't see it at all and it is almost impossible to scroll since the dropdown has expanded so little.

I did find that I can solve this by including a "Height" attribute in the <telerik:RadComboBox> tag and setting a static height - but it seems there should be a built in minimum height so that users can allow the box to dynamically resize its drop-down height without it getting too small to work with when the item count gets small.

Thanks!

Hello Brian,

Then faced issue is originated by the configured layout of the DropDown. The set Width of the DropDown, matches the width of the Table in the ItemTemplate, which forces a scroll bar to appear in the DropDown. Therefor when only one item is rendered in the DropDown it is hidden from the scroll bar. I would suggest you to decrease the table's width or increase the DropDownWidth property of the RadComboBox.
In the following manner for example :


Kind regards,
Nencho
the Telerik team

Hi,
    We are using multi column Radcombobox load on demand,its working fine with item requested event.
but while editing opening drop down preselected text not showing,attchd screen shot shows issue
below is the code

 <telerik:RadComboBox ID="RcbAccountCode" runat="server" EmptyMessage="Select a Code"
                                                                    OnClientFocus="ClientFocus" CausesValidation="false" EnableLoadOnDemand="True"
                                                                    Height="150px" EnableVirtualScrolling="false" ShowMoreResultsBox="false" MarkFirstMatch="true"
                                                                    HighlightTemplatedItems="true" OnClientItemsRequested="UpdateItemCountField"
                                                                    AutoPostBack="true" OnItemsRequested="InvoiceDetail_AccountCode1_ItemsRequested"
                                                                    Width="400px" OnDataBound="InvoiceDetail_AccountCode_DataBound" OnSelectedIndexChanged="InvoiceDetail_AccountCode1_OnSelectedIndexChanged">
                                                                    <HeaderTemplate>
                                                                        <table style="width: 100%">
                                                                            <tr style="width: 100%">
                                                                                <td style="width: 100px" align="left">
                                                                                    Code
                                                                                </td>
                                                                                <td align="left">
                                                                                    Name
                                                                                </td>
                                                                            </tr>
                                                                        </table>
                                                                    </HeaderTemplate>
                                                                    <ItemTemplate>
                                                                        <table style="width: 100%">
                                                                            <tr style="width: 100%">
                                                                                <td style="width: 100px" align="left">
                                                                                                                                                                       
                                                                                    <%# DataBinder.Eval(Container, "Attributes[\"code\"]")%>
                                                                                </td>
                                                                                <td align="left">
                                                                                   <%# DataBinder.Eval(Container, "Attributes[\"name\"]")%>
                                                                                </td>
                                                                            </tr>
                                                                        </table>
                                                                    </ItemTemplate>
                                                                    <FooterTemplate>
                                                                        A total of
                                                                        <asp:Literal runat="server" ID="RadComboItemsCount" />
                                                                        items
                                                                    </FooterTemplate>
                                                                </telerik:RadComboBox>


------------------------------------------------------------------------
below is the pre selected code while edit

RadComboBoxItem itemData = new RadComboBoxItem();
 itemData.Text = ds1.Tables[0].Rows[0]["name"].ToString();
 itemData.Attributes.Add("name", ds1.Tables[0].Rows[0]["name"].ToString());
 itemData.Value = ds1.Tables[0].Rows[0]["code"].ToString();
  itemData.Attributes.Add("code", ds1.Tables[0].Rows[0]["code"].ToString());
 RcbAccCode.Items.Insert(0, itemData);
 RcbAccCode.SelectedIndex = 0;


i want to show preselected text in dropdown while opening.please let me know how to fix this.

Thanks
Karthik

Hi KARTHIK,

Please have a look into this online demo which works as expected for me. Please try to replicate the issue in this online demo or provide a sample code where I can replicate the issue for further help.

Thanks,
Shinu.

H shinu,
  Thanks for your response.
   Multi column radcombo box load on demand is working as expected .This combo is used in  rad grid edit form.but only issue i have is while edit pre selected value is showing properly. when i remove the preselected text and open drop down item is there but not showing text(see attached screenshot from previous post)

below is the code

aspx code

   <telerik:RadComboBox ID="RcbAccountCode" runat="server" EmptyMessage="Select a Code"
                                                                    OnClientFocus="ClientFocus" CausesValidation="false" EnableLoadOnDemand="True"
                                                                    Height="150px" EnableVirtualScrolling="false" ShowMoreResultsBox="false" MarkFirstMatch="true"
                                                                    HighlightTemplatedItems="true" OnClientItemsRequested="UpdateItemCountField"
                                                                    AutoPostBack="true" OnItemsRequested="InvoiceDetail_AccountCode1_ItemsRequested"
                                                                    Width="400px" OnDataBound="InvoiceDetail_AccountCode_DataBound" OnSelectedIndexChanged="InvoiceDetail_AccountCode1_OnSelectedIndexChanged">
                                                                    <HeaderTemplate>
                                                                        <table style="width: 100%">
                                                                            <tr style="width: 100%">
                                                                                <td style="width: 100px" align="left">
                                                                                    Code
                                                                                </td>
                                                                                <td align="left">
                                                                                    Name
                                                                                </td>
                                                                            </tr>
                                                                        </table>
                                                                    </HeaderTemplate>
                                                                    <ItemTemplate>
                                                                        <table style="width: 100%">
                                                                            <tr style="width: 100%">
                                                                                <td style="width: 100px" align="left">
                                                                                                                                                                       
                                                                                    <%# DataBinder.Eval(Container, "Attributes[\"code\"]")%>
                                                                                </td>
                                                                                <td align="left">
                                                                                   <%# DataBinder.Eval(Container, "Attributes[\"name\"]")%>
                                                                                </td>
                                                                            </tr>
                                                                        </table>
                                                                    </ItemTemplate>
                                                                    <FooterTemplate>
                                                                        A total of
                                                                        <asp:Literal runat="server" ID="RadComboItemsCount" />
                                                                        items
                                                                    </FooterTemplate>
                                                                </telerik:RadComboBox>


Below is item requested event

protected void InvoiceDetail_AccountCode1_ItemsRequested(object sender, RadComboBoxItemsRequestedEventArgs e)
    {

        bool bfilter = true;
        DataSet ds = new DataSet();
        if (e.Text == "")
        {
            bfilter = false;
        }

        RadComboBox RcbAccCode = (RadComboBox)sender;

        RcbAccCode.Items.Clear();
       

        ds = LoadAccCode(bfilter, e.Text, RcbAccCode);
        int itemOffset = e.NumberOfItems;
        int endOffset = Math.Min(itemOffset + ItemsPerRequest, ds.Tables[0].Rows.Count);
        e.EndOfItems = endOffset == ds.Tables[0].Rows.Count;
        for (int i = itemOffset; i < endOffset; i++)
        {
            RadComboBoxItem itemData = new RadComboBoxItem();
            itemData.Text = ds.Tables[0].Rows[i]["name"].ToString();
            itemData.Attributes.Add("name", ds.Tables[0].Rows[i]["name"].ToString());
            itemData.Value = ds.Tables[0].Rows[i]["code"].ToString();
            itemData.Attributes.Add("code", ds.Tables[0].Rows[i]["code"].ToString());

            RcbAccCode.Items.Add(itemData);
          
        }
 
        RcbAccCode.DataBind();
        

    }


below id radgrid databound code

 protected void RadGrid1_OnItemDataBound(object sender, Telerik.Web.UI.GridItemEventArgs e)
    {
if (e.Item.IsInEditMode)
        {
            if (!(e.Item is IGridInsertItem))
            {
                if (e.Item is GridEditFormItem)
                {
                    RadComboBox RcbAccCode = (RadComboBox)e.Item.FindControl("RcbAccountCode");     if (RcbAccCode != null)
                   
 squery = "select * from vw_AcctgCOACode where code ='" + dataItem["Account"].Text + "' ";
                            ds1 = DBUtils.ExecuteDataset(squery);
                            if (ds1.Tables[0].Rows.Count > 0)
                            {
                                RadComboBoxItem itemData = new RadComboBoxItem();
                                itemData.Text = ds1.Tables[0].Rows[0]["name"].ToString();
                                itemData.Attributes.Add("name", ds1.Tables[0].Rows[0]["name"].ToString());


                                itemData.Value = ds1.Tables[0].Rows[0]["code"].ToString();
                                itemData.Attributes.Add("code", ds1.Tables[0].Rows[0]["code"].ToString());

                              
                                RcbAccCode.Items.Insert(0, itemData);
                                RcbAccCode.SelectedIndex = 0;
                            }

                       

}
}
}

Thanks
Karthik.A

Hi Karthik,

Please try the sample code snippet which works fine at my end.

ASPX:

C#:

Thanks,
Shinu.