将大量数据绑定到组合框中？

Question

我想将员工列表绑定到下拉列表中，并使用自动完成功能，以便用户可以搜索适当的名称。我使用RadComboBox

我有两个主要问题：

1- 列表非常大，约为5000项。因此，在浏览器中绑定如此庞大的数据会使其崩溃或变得非常缓慢。（性能问题）

根据Telerik文件

  

将数据源设置为RadComboBox。 使用DataSourceID或DataSource属性来执行此操作，并将DataTextField和DataValueField属性设置为数据源中的相应字段。 （注意，使用DataSource时，必须在每个回发中设置该属性，最方便的是在Page_Init中设置）。 设置EnableAutomaticLoadOnDemand为true。

所以我必须在Page_Init中每次调用以下方法！

  protected void BindInnerInstructors()
    {
        ddl_inner_sup.Items.Clear();
        ddl_inner_sup.DataSource = Utilities.GetAllInnerInstructors();
        ddl_inner_sup.DataValueField = "emp_num";
        ddl_inner_sup.DataTextField = "name";
        ddl_inner_sup.DataBind();
    }

---

2- 当尝试设置下拉框的选择时，出现“对象引用未将对象实例化”的错误。

我通过这个方法解决了这个问题。

---

我有大约4个下拉列表，但每一个都必须根据事件进行数据绑定，而我必须在page_init中绑定所有下拉列表。

非常感谢对这个问题的详细回答。

- Anyname Donotcare

---

您可以在此处找到详细答案：http://demos.telerik.com/aspnet-ajax/combobox/examples/loadondemand/wcf/defaultcs.aspx?#qsf-demo-source - Yuriy Rozhovetskiy

@YuriyRozhovetskiy：非常感谢，但我想知道当组合框绑定数据时，如果我希望组合框仅在特定事件中绑定数据以提高性能，怎么办？ - Anyname Donotcare

Answer 1

我的公司曾遇到类似问题。我们最终使用了一个称为Select2的jquery对象，并进行了懒加载。基本上，我们只在加载时加载前10个左右，使其快速加载，如果用户向下滚动超过前10个，我们会加载接下来的10个等等。Select2具有搜索功能，它会命中服务器以返回基于搜索的自定义列表。

一次性加载5000个元素的问题在于，浏览器需要很长时间才能加载它们，迭代并根据需要操作它们。我不是说“你必须使用select2”，RadComboBox可能会有类似的东西可以使用。

祝好运。

- Kenneth Garza

---

你能给我一个 .net 的示例代码吗？你如何处理这个控件？ - Anyname Donotcare

很遗憾我无法提供示例。在 .Net 中，您需要创建一个方法来加载所需的数据。您需要进行一些关于分页的研究。这只是将大型数据集拆分成更小的可管理块的想法。这些数据需要通过 javascript/jquery 加载。您需要创建一个事件，当用户滚动到列表底部时，它会加载下一页数据。如果有人搜索某些内容，则需要另一个 .net 调用返回搜索数据。 - Kenneth Garza

我通过谷歌小搜索找到了这个。它可能会有用。http://www.telerik.com/community/code-library/aspnet-ajax/combobox/paging-in-radcombobox-load-on-demand.aspx - Kenneth Garza

几天后回来看这个问题，我想起了在工作中遇到的问题。问题是“我们如何期望最终用户浏览5000个元素？”（我调整了数字以适应您的问题）。我们不得不重新考虑我们试图做什么。最终用户很可能不想滚动浏览5000个元素，只为找到他们正在寻找的一个或两个元素。因此，在这个问题存在的情况下，您可能需要重新考虑是否要加载所有5000个元素，而是从不同的角度来解决这个问题。 - Kenneth Garza

就像一个预加载了客户最后搜索结果的列表或其他什么东西。这需要更多的工作，但更加以终端用户为中心。祝你好运。 - Kenneth Garza

Answer 2

我建议不要直接展示数据集，而是将其存储在JavaScript对象中。然后，您可以使用该对象列表进行自动补全。这可以通过jQuery完成，使用选择器，然后应用自动补全函数来实现。

示例：

var systems = [{t:"hi",s:"something"}.{t:"hi",s:"something"},{t:"hi",s:"something"}];
$("#s").autocomplete(systems, 
{
width: 300,
formatItem: function(item) 
{ return item.t + item.s; },
formatResult: function(item) 
{ return item.t; }
});

- Fallenreaper

---

我想添加一个注释，即 formatItem 部分用于在下拉菜单中显示格式化字符串，例如带颜色的 span 等或任何类型的 CSS/附加信息，但 formatitem 是存储在框中的部分。 - Fallenreaper

Answer 3

如果要显示大量的项，请使用VirtualizingStackPanel作为RadComboBoxes的ItemsPanel。使用VirtualizingStackPanel，您可以在RadComboBox中拥有成千上万的项。

请使用以下XAML代码：

            <!-- WPF ItemsControls like ComboBox, ListBox or Menu use a StackPanel as their internal layout panel. 
                 Use a VirtualizingStackPanel for performance. Else the Combobox will freeze!   -->
            <ItemsPanelTemplate x:Key="itemsPanelTemplate">
                <VirtualizingStackPanel />
            </ItemsPanelTemplate>

            <!-- This style specifies how RadComboBoxes look like -->
            <Style TargetType="telerik:RadComboBox">
                <Setter Property="ItemsPanel" Value="{StaticResource itemsPanelTemplate}"/>
            </Style>

- Knasterbax

Answer 4

我也遇到过类似的情况，即将大量值绑定到下拉列表中。最新版本的Chrome、Firefox和IE可以绑定，但需要大约几分钟时间，而对于旧版本，脚本会挂起并永远无法工作。

我们采用简单的方法，而不是使用任何自定义控件或Telerik Rad Box。 我们将“页面大小”（例如50）和“页码”（默认为1）、“页面数量”（总计数/页面大小）和“搜索条件”（用户输入的自动完成）作为服务返回值的参数，并根据输入搜索条件和页面编号仅获取与页面大小相等的记录。

在文本框中使用此服务调用绑定到文本更改事件，并将输出绑定到自动完成下拉列表。

分页和搜索的逻辑在存储过程中实现，如带有排序、分页和过滤的存储过程。

这比任何客户端分页、绑定等都更易于维护，且速度快。

- Pranav Singh

Answer 5

为了简单起见，您只需添加前15或20个名称，当用户在组合框上键入时，使用从数据库返回的名称填充组合框，但不是全部，只填充几个名称，以便浏览器不会挂起...

- Umar Sid

Answer 6

你可以像谷歌一样做。当你在谷歌上输入内容时，与你输入不同的文本将消失，而相同的文本将保留下来。这将使你的搜索更加容易，这就是答案。

- r.mirzojonov