Virtual Loading using Item Template Issue

2 posts, 0 answers
  1. John
    John avatar
    17 posts
    Member since:
    Apr 2013

    Posted 09 May 2013 Link to this post

    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?
  2. Nencho
    Admin
    Nencho avatar
    1822 posts

    Posted 14 May 2013 Link to this post

    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
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
Back to Top