AutoCompleteBox - Declarative Binding

ObjectDataSource

SqlDataSource

XmlDataSource

Isolate this demo as a stand-alone application
  • About this demo
  • C#
  • VB

RadAutoCompleteBox can be bound to all ASP.NET Data Source controls:

  • AccessDataSource
  • ObjectDataSource
  • XmlDataSource
  • SqlDataSource
  • SiteMapDataSource
  • LinqDataSource

Databinding properties and methods used when binding RadAutoCompleteBox to a data source:

  • DataSource property - set to an instance of the data source.
  • DataSourceID property - set to the ID of the data source.
  • DataMember property - if the data source is a DataSet and DataMember is a set, then RadAutoCompleteBox is bound to the DataTable with the respective name in the DataSet.
  • DataTextField property - field name from the data source bound to the AutoCompleteBoxItemData's Text property.
  • DataValueField property - field name from the data source bound to the AutoCompleteBoxItemData's Value property.
  • DataBind method - must be called after the aforementioned properties are set when binding at runtime.
  • DefaultCS.aspx
  • DefaultCS.aspx.cs
  • autocomplete.xml
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="DefaultCS.aspx.cs" Inherits="AutoCompleteBox.Examples.DeclarativeDataSources.DefaultCS" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<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" />

    <div class="demo-container size-thin">
        <h2>ObjectDataSource</h2>
        <telerik:RadAutoCompleteBox RenderMode="Lightweight" ID="RadAutoCompleteBox1" runat="server"  Width="300" MaxResultCount="5"
            DataSourceID="ObjectDataSource1" DataTextField="Title" DataValueField="Id" EmptyMessage="Select Movies">
        </telerik:RadAutoCompleteBox>
    </div>
    <div class="demo-container size-thin">
        <h2>SqlDataSource</h2>
        <telerik:RadAutoCompleteBox RenderMode="Lightweight" ID="RadAutoCompleteBox2" runat="server"  Width="300" MaxResultCount="5"
            DropDownHeight="200" DataSourceID="SqlDataSource1" DataTextField="ContactName" EmptyMessage="Select Customers"
            DataValueField="CustomerID">
        </telerik:RadAutoCompleteBox>
    </div>

    <div class="demo-container size-thin">
        <h2>XmlDataSource</h2>
        <telerik:RadAutoCompleteBox RenderMode="Lightweight" ID="RadAutoCompleteBox3" runat="server"  Width="300" MaxResultCount="5"
            DataTextField="Text" DataValueField="Value" EmptyMessage="Select Product Families">
        </telerik:RadAutoCompleteBox>
    </div>

    <asp:ObjectDataSource ID="ObjectDataSource1" runat="server" TypeName="Telerik.Web.Examples.Movie"
        SelectMethod="GetMovieList"></asp:ObjectDataSource>
    <asp:SqlDataSource runat="server" ID="SqlDataSource1" ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>"
        ProviderName="System.Data.SqlClient" SelectCommand="SELECT [CustomerID], [ContactName] FROM [Customers] ORDER By ContactName"></asp:SqlDataSource>
    <asp:XmlDataSource runat="server" ID="XmlDataSource1" DataFile="autocomplete.xml"></asp:XmlDataSource>

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

Find Assistance

Help Us Improve

Was this example helpful?