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

ListBox with 15000 items

5 Answers 184 Views
ListBox
This is a migrated thread and some comments may be shown as answers.
Narasima Perumal Chandramohan
Top achievements
Rank 1
Narasima Perumal Chandramohan asked on 17 Nov 2009, 12:12 PM
In my case, I will have two List Box ListBox1 and ListBox2. ListBox1 is loaded with 15000 items. When the user clicks a button, the selected item in ListBox1 is moved to ListBox2 and the selected item is removed from ListBox1.

Following are the problems that I face,

- Page load itself is slow. I am loading the items in ListBox1 in Page load(takes about 45 seconds)
- Selecting an item in ListBox1 is slow(takes about 1 minute)
- Moving the selected item from ListBox1 to ListBox2 is slow(3 minutes), sometimes the page goes not responding

Kindly help me to overcome these issues.

5 Answers, 1 is accepted

Sort by
0
Paul
Telerik team
answered on 17 Nov 2009, 12:29 PM
Hello Narasima Perumal Chandramohan,

Thank you for contacting us.

Unfortunately there are still some limits to the capabilities of the RadListBox control. The built-in ASP.NET controls are rendered natively by the browser as select HTML elements. That's why they are faster. Our replacements can't get that fast no matter what. RadListBox has javascript that has to be initialized. After the Ajax update ASP.NET AJAX framework disposes the updated controls which requires DOM element traversal of 15000x2 DOM nodes which is slow. Having said that, we are considering certain optimizations to speed up the RadListBox, like load on demand and virtual scrolling. However handling of 15000 items in the DOM tree will remain not very fast. Overall we suggest you for now to use RadComboBox with load on demand and virtual scrolling to handle this load.

On a side note you can switch the ViewState off, since it amounts to 2MB of the 3MB transferred on the all items Ajax request.

Kind regards,
Paul
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
0
Narasima Perumal Chandramohan
Top achievements
Rank 1
answered on 17 Nov 2009, 12:52 PM
But with RadComboBox I can't show the list of items as in ListBox. Is it possible to render a RadCombobox as RadListBox?

We are currently evaluating your product to purchase it.
0
Simon
Telerik team
answered on 18 Nov 2009, 04:38 PM
Hello Narasima Perumal Chandramohan,

You could make a RadComboBox to stay with its drop down always open by setting its OpenDropDownOnLoad property to true and canceling its DropDownOpening client-side event:

function onDropDownOpening(sender, eventArgs) {
    eventArgs.set_cancel(true);
}

Best wishes,
Simon
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
0
Narasima Perumal Chandramohan
Top achievements
Rank 1
answered on 19 Nov 2009, 12:21 PM
The given solution is not working
[ASPX Page]

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<telerik:RadStyleSheetManager id="RadStyleSheetManager1" runat="server" />
</head>
<body>
    <form id="form1" runat="server">
<telerik:RadScriptManager ID="RadScriptManager1" runat="server">
<Scripts>
<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" />
<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" />
</Scripts>
</telerik:RadScriptManager>
<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
</telerik:RadAjaxManager>
<div>

   <telerik:RadComboBox ID="RadComboBox1" Runat="server" 
            Height="200px" Width="155px" EnableLoadOnDemand="True" 
            OnItemsRequested="RadComboBox1_ItemsRequested" 
            EmptyMessage="Choose an item..." OpenDropDownOnLoad="True" 
            onclientdropdownopening="onDropDownOpening">
        </telerik:RadComboBox>
            <br />
        <br />
        <br />
        <br />

</div>
    <script type="text/javascript" language="javascript">
        function onDropDownOpening(sender, eventArgs) {
            eventArgs.set_cancel(true);
        }
    </script>   
</form>
</body>
</html>

[ASPX Page]

[Code Behind]
using System;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

using System.Data;
using System.Configuration;
using System.Web.Security;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
using Telerik.Web.UI;

public partial class Default : System.Web.UI.Page 
{
    protected void Page_Load(object sender, EventArgs e)
    {
        for (int i = 0; i < 15000; i++)
        {
            RadComboBox1.Items.Add(new RadComboBoxItem("hello" + i));
        }

    }
}
[Code Behind]
0
Paul
Telerik team
answered on 19 Nov 2009, 01:14 PM
Hello Narasima Perumal Chandramohan,

Sorry for misleading you. You should cancel the OnClientDropDownClosing client-side event.

<form id="form1" runat="server">
    <asp:ScriptManager ID="ScriptManager1" runat="server">
    </asp:ScriptManager>
    <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
    </telerik:RadAjaxManager>
    <div>
        <telerik:RadComboBox ID="RadComboBox1" runat="server" Height="200px" Width="155px"
            EnableLoadOnDemand="True" OnItemsRequested="RadComboBox1_ItemsRequested" EmptyMessage="Choose an item..."
            OpenDropDownOnLoad="True" OnClientDropDownClosing="OnClientDropDownClosing">
        </telerik:RadComboBox>
    </div>
 
    <script type="text/javascript" language="javascript">
        function OnClientDropDownClosing(sender, eventArgs) {
            eventArgs.set_cancel(true);
        }
    </script>
 
    </form>


Greetings,
Paul
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
Tags
ListBox
Asked by
Narasima Perumal Chandramohan
Top achievements
Rank 1
Answers by
Paul
Telerik team
Narasima Perumal Chandramohan
Top achievements
Rank 1
Simon
Telerik team
Share this question
or