Virtual Loading using Item Template Issue

[John]

In my combo box I am using the grid like implentaion. I have two columns in the combo box. I am using the OnItemRequested event to do virtual loading since the dataset is huge and causes major performance issues other wise. The problem is when I use virtual loading the data is not visible. It is there as I can click in what looks like an empty box and the value populates as expected but it is not visible otherwise. Please see screenshot attached for details on that. Now my code

RadComboBox implementation code:

<telerik:RadComboBox ID="d1ConDDL" Width="275px" Height="150px" DropDownWidth="275px" OnItemsRequested="contactItemsRequested"
                                runat="server" EmptyMessage="Please choose a contact..." HighlightTemplatedItems="True" EnableVirtualScrolling="True"
                                ShowMoreResultsBox="True" EnableLoadOnDemand="True">
                                <HeaderTemplate>
                                    <table style="width: 250px; text-align: left">
                                        <tr>
                                            <td style="width: 125px;">
                                                Contact Name
                                            </td>
                                            <td style="width: 125px;">
                                                Contact ID
                                            </td>
                                        </tr>
                                    </table>
                                </HeaderTemplate>
                                <ItemTemplate>
                                    <table style="width: 250px; text-align: left;">
                                        <tr>
                                            <td style="width: 125px;">
                                                <%# DataBinder.Eval(Container,"Attributes['CONTACT_ORG']") %>
                                            </td>
                                            <td style="width: 125px; text-align: left">
                                                <%# DataBinder.Eval(Container, "Attributes['CONTACT_ID']")%>
                                            </td>
                                        </tr>
                                    </table>
                                </ItemTemplate>
                            </telerik:RadComboBox>

OnItemRequested Event Code:

protected void contactItemsRequested(object sender, RadComboBoxItemsRequestedEventArgs e)
        {
            var ds = new DataSet();
            var factory = new QueryFactory(new Configuration().DataConfigurationFile);
            var query = factory.GetQuery("P_GET_ALL_CONTACTS");
            query.Fill(ds);
            var dt = ds.Tables[0];

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

            for (var i = itemOffset; i < endOffset; i++)
            {
                d1ConDDL.Items.Add(new RadComboBoxItem(dt.Rows[i]["CONTACT_ORG"].ToString(), dt.Rows[i]["CONTACT_ID"].ToString()));
                d2ConDDL.Items.Add(new RadComboBoxItem(dt.Rows[i]["CONTACT_ORG"].ToString(), dt.Rows[i]["CONTACT_ID"].ToString()));
            }
            d1ConDDL.DataBind();
            e.Message = GetStatusMessage(endOffset, dt.Rows.Count);
        }

Any ideas why the data is in the box but cannot be seen?

[Nencho]

Hello John,

As you use a RadComboBoxItem, whit setting its Text and Value, you should evaluate the Text and Value properties in the ItemTemplate of the RadComboBox. In addition, I would suggest you to explicitly call the DataBind() method on the RadComboBoxItem, once it is added to the items collection. Please consider the following implementation:
//markup:

<telerik:RadComboBox ID="d1ConDDL" Width="275px" Height="150px" DropDownWidth="275px" OnItemsRequested="d1ConDDL_ItemsRequested"
                runat="server" EmptyMessage="Please choose a contact..." HighlightTemplatedItems="True"
                EnableVirtualScrolling="True" ShowMoreResultsBox="True" EnableLoadOnDemand="True">
                <HeaderTemplate>
                    <table style="width: 250px; text-align: left">
                        <tr>
                            <td style="width: 125px;">Contact Name
                            </td>
                            <td style="width: 125px;">Contact ID
                            </td>
                        </tr>
                    </table>
                </HeaderTemplate>
                <ItemTemplate>
                    <table style="width: 250px; text-align: left;">
                        <tr>
                            <td style="width: 125px;">
                                <%# DataBinder.Eval(Container,"Text") %>
                            </td>
                            <td style="width: 125px; text-align: left">
                                <%# DataBinder.Eval(Container, "Value") %>
                            </td>
                        </tr>
                    </table>
                </ItemTemplate>
            </telerik:RadComboBox>

//code-behind:

protected void d1ConDDL_ItemsRequested(object sender, RadComboBoxItemsRequestedEventArgs e)
    {

        var ds = new DataSet();
        var factory = new QueryFactory(new Configuration().DataConfigurationFile);
        var query = factory.GetQuery("P_GET_ALL_CONTACTS");
        query.Fill(ds);
        var dt = ds.Tables[0];

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

        for (var i = itemOffset; i < endOffset; i++)
        {
            RadComboBoxItem item = new RadComboBoxItem(data.Rows[i]["CompanyName"].ToString(), data.Rows[i]["CompanyName"].ToString());
            d1ConDDL.Items.Add(item);
            item.DataBind();
        }
        e.Message = GetStatusMessage(endOffset, dt.Rows.Count);
    }

All the best,
Nencho
the Telerik team