New to Telerik UI for ASP.NET AJAX? Download free 30-day trial

Automatic Load On Demand

  • Demo Configurator

Filter

RadComboBox supports codeless or Automatic Load On Demand with all kinds of data sources. This particular demo demonstrates how to implement Load On Demand binding with EntityFramework.

Setting up the automatic Load On Demand is straightforward:

  • Set the DataSourceID property to the ID of the data source and the DataTextField and DataValueField properties to the respective fields in the data items returned by it.
  • Set EnableAutomaticLoadOnDemand to true.
  • (Optional) Set ShowMoreResultsBox/EnableVirtualScrolling to true to enable the respective features.
  • (Optional) Set ItemsPerRequest to the number of Items you would like to load per request. The default (-1) loads all Items at once.

Note: When you use the DataSourceID or DataSource properties to bind RadComboBox during automatic Load On Demand the ItemDataBound event fires normally, which means that you can use it to change the Item's Text and Value properties as well as modify its Attributes collection based on the DataItem, etc.

  • DefaultCS.aspx
  • DefaultCS.aspx.cs
  • styles.css
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="DefaultCS.aspx.cs" Inherits="ComboBox.Examples.LoadOnDemand.AutomaticLoadOnDemand.DefaultCS" %>

<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
<%@ Register TagPrefix="qsf" Namespace="Telerik.QuickStart" %>

<!DOCTYPE html>
<html xmlns='http://www.w3.org/1999/xhtml'>
<head runat="server">
    <title>Telerik ASP.NET Example</title>
</head>

<body>
    <form id="form1" runat="server">
    <telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
    <telerik:RadSkinManager ID="RadSkinManager1" runat="server" ShowChooser="true" />

    <telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server">

        <div class="demo-container size-thin">

            <telerik:RadComboBox RenderMode="Lightweight" ID="RadComboBox1" runat="server" Height="180" Width="300" 
                DataSourceID="EntityDataSource1" DataTextField="ContactName" DataValueField="ContactName"
                EnableAutomaticLoadOnDemand="true" ShowMoreResultsBox="true" EnableVirtualScrolling="true"
                ItemsPerRequest="10">
            </telerik:RadComboBox>
        </div>
        <asp:EntityDataSource ID="EntityDataSource1" runat="server" ConnectionString="name=NorthwindReadWriteEntities"
            DefaultContainerName="NorthwindReadWriteEntities" EntitySetName="Customers" Select="it.[ContactName]"
            AutoPage="true" OrderBy="it.[ContactName]" />

    </telerik:RadAjaxPanel>



    <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
        <AjaxSettings>
            <telerik:AjaxSetting AjaxControlID="ConfigurationPanel1">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="ConfigurationPanel1" LoadingPanelID="RadAjaxLoadingPanel1" />
                    <telerik:AjaxUpdatedControl ControlID="RadComboBox1" />
                </UpdatedControls>
            </telerik:AjaxSetting>
        </AjaxSettings>
    </telerik:RadAjaxManager>

    <qsf:ConfiguratorPanel runat="server" ID="ConfigurationPanel1">
        <Views>
            <qsf:View>
                <qsf:ConfiguratorColumn ID="ConfiguratorColumn1" runat="server">
                    <qsf:RadioButtonList ID="FilterStartsWith" runat="server" Label="Filter" AutoPostBack="true">
                        <asp:ListItem Text="StartsWith" Value="0" Selected="True" />
                        <asp:ListItem Text="Contains" Value="1" />
                    </qsf:RadioButtonList>
                </qsf:ConfiguratorColumn>
            </qsf:View>
        </Views>
    </qsf:ConfiguratorPanel>

    </form>
</body>
</html>

Support & Learning Resources

Find Assistance