Load On Demand, Duplicates on Virtual Scrolling

5 posts, 1 answers
  1. Jeff Reinhardt
    Jeff Reinhardt avatar
    56 posts
    Member since:
    Oct 2009

    Posted 17 Aug 2010 Link to this post

    I have a combobox with Loadondemand and I keep getting deplicates on scrolling:

     

     

     

    <telerik:RadComboBox ID="radcmbInmate" runat="server" Width="200px" Height="150px" AllowCustomText="false" EmptyMessage="Select an Inmate" EnableLoadOnDemand="True" ShowMoreResultsBox="true" Filter="None" EnableVirtualScrolling="true" MarkFirstMatch="true" HighlightTemplatedItems="true" DataTextField="FullName" DataValueField="InmateID" OnItemsRequested="radcmbInmate_ItemsRequested">
    </telerik:RadComboBox>

     

     


     

    private DataSet GetInmateDataSet(string inmateText)
    {
         string errorMsg = string.Empty;
         DataSet DS = new DataSet();
         Inmate.GetByName(FacilityID, inmateText, ref DS, ref errorMsg);
         return DS;
    }
      
    protected void radcmbInmate_ItemsRequested(object sender, RadComboBoxItemsRequestedEventArgs e)
    {
         DataSet data = GetInmateDataSet(e.Text);
         radcmbInmate.DataSource = data;
         radcmbInmate.DataBind();
    }
  2. Answer
    Simon
    Admin
    Simon avatar
    2281 posts

    Posted 18 Aug 2010 Link to this post

    Hello Jeff Reinhardt,

    You are missing the server-side logic in the ItemsRequested event handler that loads only the needed portion of Items. Please see this demo for the complete code.

    Greetings,
    Simon
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  3. Jeff Reinhardt
    Jeff Reinhardt avatar
    56 posts
    Member since:
    Oct 2009

    Posted 18 Aug 2010 Link to this post

    Thank you this works for the example I showed you, but how would this work for a multi-column combobox?

    <telerik:RadComboBox ID="radcmbProduct" runat="server" Width="400px" Height="200px" AllowCustomText="false" EmptyMessage="Select a Product" EnableLoadOnDemand="True" ShowMoreResultsBox="true" DropDownWidth="600px"                             EnableVirtualScrolling="true" HighlightTemplatedItems="true" MarkFirstMatch="true" ItemsPerRequest="60" NoWrap="true" OnItemsRequested="radcmbProduct_ItemsRequested" OnItemDataBound="radcmbProduct_ItemDataBound">
         <HeaderTemplate>
            <ul>
               <li class="col1">Title</li>
               <li class="col2">System</li>
               <li class="col3">Price</li>
            </ul>
         </HeaderTemplate>
         <ItemTemplate>
            <ul>
               <li class="col1">
                   <%# DataBinder.Eval(Container.DataItem, "Title") %></li>
               <li class="col2">
                   <%# DataBinder.Eval(Container.DataItem, "GameSystemName") %></li>
               <li class="col3">
                   <%# DataBinder.Eval(Container.DataItem, "DisplayPrice")%></li>
            </ul>
       </ItemTemplate>
    </telerik:RadComboBox>

    This code below cannot work as you need to provide all the info for the template...  but I am not sure how to programmatically provide that info, as I have always done just a databind to a dataset since I had no need for load on demand or anything fancy in most other situations.

    How would I change this code:

    int itemOffset = e.NumberOfItems;
    int endOffset = Math.Min(itemOffset + ItemsPerRequestProduct, data.Tables[0].Rows.Count);
    e.EndOfItems = endOffset == data.Tables[0].Rows.Count;
      
    for (int i = itemOffset; i < endOffset; i++)
    {
       radcmbProduct.Items.Add(new RadComboBoxItem(data.Tables[0].Rows[i]["Title"].ToString(), data.Tables[0].Rows[i]["ProductID"].ToString()));
    }
      
    e.Message = GetStatusMessage(endOffset, data.Tables[0].Rows.Count);

  4. Cori
    Cori avatar
    562 posts
    Member since:
    Jul 2010

    Posted 18 Aug 2010 Link to this post

    Hello Jeff,

    To add more fields to use in a multi-column situation, try doing it this way:

    int itemOffset = e.NumberOfItems; 
    int endOffset = Math.Min(itemOffset + ItemsPerRequestProduct, data.Tables[0].Rows.Count); 
    e.EndOfItems = endOffset == data.Tables[0].Rows.Count; 
        
    for (int i = itemOffset; i < endOffset; i++) 
       RadComboBoxItem cmdItem = new RadComboBoxItem(data.Tables[0].Rows[i]["Title"].ToString(), data.Tables[0].Rows[i]["ProductID"].ToString());
       cmbItem.Attributes.Add("GameSystemName",data.Tables[0].Rows[i]["GameSystemName"].ToString());
       cmbItem.Attributes.Add("DisplayPrice",data.Tables[0].Rows[i]["DisplayPrice"].ToString());
       radcmbProduct.Items.Add(cmbItem);
       cmbItem.DataBind();
        
    e.Message = GetStatusMessage(endOffset, data.Tables[0].Rows.Count);

    And the ItemTemplate should look like this:

    <ItemTemplate>  
            <ul>  
               <li class="col1">  
                   <%# DataBinder.Eval(Container, "Text") %></li>  
               <li class="col2">  
                   <%# DataBinder.Eval(Container, "Attributes['GameSystemName']") %></li>  
               <li class="col3">  
                   <%# DataBinder.Eval(Container, "Attributes['DisplayPrice']")%></li>  
            </ul>  
       </ItemTemplate>

    So basically, I added the extra fields as Attributes of the RadComboBoxItem. For your Title field I'm binding it to the Text property of the RadComboBoxItem, since that is how it's being added.

    I hope that helps.
  5. Jeff Reinhardt
    Jeff Reinhardt avatar
    56 posts
    Member since:
    Oct 2009

    Posted 18 Aug 2010 Link to this post

    Ok that gets the control working as expected, however, it breaks one piece of functionality I need.  During the ItemDataBound event for the combobox I was setting the text and value as follows:

    protected void radcmbProduct_ItemDataBound(object sender, RadComboBoxItemEventArgs e)
    {
       e.Item.Text = e.Item.Text.ToString() + " | " + e.Item.Attributes["GameSystemName"].ToString() + " | " + e.Item.Attributes["DisplayPrice"].ToString();
       e.Item.Value = ((DataRowView)e.Item.DataItem)["ProductID"].ToString();
    }

    This is important so that when the user selects an item it shows the three column values from that item separated by a pipe delimter ' | '

    I tried to fix it in the code above my switching to the attributes but the only thing that gets set on select is the Text of the Title.
Back to Top