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

Integration with RadListBox

  • Test

Since Q2 2014 the RadListBox can be bound to RadClientDataSource control. This functionality is provided out of the box through the server-side ClientDataSourceID property.

RadListBox needs the following properties in order to load its items properly:

  • DataKeyField—defines the data source field name which will be considered as the key of the item.
  • DataText—defines the data source field name which will be shown as text of the item.
  • DataValue—defines the data source field name which will be considered as value of the item .

When the EnableLoadOnDemand property is enabled the RadListBox will request its items from the RadClientDataSource on portions.

  • DefaultCS.aspx
  • DefaultCS.aspx.cs
<%@ Page Title="" Language="C#"  AutoEventWireup="true" CodeFile="DefaultCS.aspx.cs" 
    Inherits="ListBox_Examples_PopulatingWithData_Client_Side_Data_Binding_DefaultCS" %>

<!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:RadClientDataSource runat="server" ID="RadClientDataSource1">
        <DataSource>
            <WebServiceDataSourceSettings ServiceType="OData">
                <Select Url="Products" DataType="JSON" />
            </WebServiceDataSourceSettings>
        </DataSource>
        <Schema DataName="d.results">
        </Schema>
    </telerik:RadClientDataSource>
    
    <div class="demo-container size-thin">
        <telerik:RadListBox RenderMode="Lightweight" ID="RadListBox1" runat="server" ClientDataSourceID="RadClientDataSource1"
            DataTextField="ProductName" DataValueField="ProductID" EnableLoadOnDemand="true"
            Height="200px" Width="300px">
        </telerik:RadListBox>
    </div>
    </form>
</body>
</html>

Support & Learning Resources

Find Assistance