AutoCompleteBox - Add/Remove Tokens

Demo Configurator


  •  
Isolate this demo as a stand-alone application
  • About this demo
  • C#
  • VB
RadAutoCompleteBox provides rich server API for working with the control on the server.

This application scenario shows how to work with the Entries collection of RadAutoCompleteBox. It is an example of adding and removing entries from the Entries collection, with the necessary operations being performed entirely on the server.

  • DefaultCS.aspx
  • DefaultCS.aspx.cs
<%@ Page AutoEventWireup="true" CodeFile="DefaultCS.aspx.cs" Inherits="AutoCompleteBox.Examples.Programming.AddRemove.DefaultCS"Language="c#"  %>

<!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" />

    <telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server">
        <div class="demo-container size-narrow">
            <telerik:RadAutoCompleteBox RenderMode="Lightweight" ID="RadAutoCompleteBox1" runat="server"  Width="500"
                DropDownHeight="250" DataSourceID="SqlDataSource1" DataTextField="CompanyName" EmptyMessage="Company Name"
                AllowCustomEntry="True">
            </telerik:RadAutoCompleteBox>
        </div>
    </telerik:RadAjaxPanel>

    <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:TelerikConnectionString %>"
        ProviderName="System.Data.SqlClient" SelectCommand="SELECT * FROM [CustomerPhotos]"></asp:SqlDataSource>


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

    <telerik:RadAjaxLoadingPanel runat="server" ID="RadAjaxLoadingPanel1" />

    <qsf:ConfiguratorPanel runat="server" ID="ConfigurationPanel1">
        <Views>
            <qsf:View Title="Available actions">
                <qsf:ConfiguratorColumn ID="ConfiguratorColumn1" runat="server" Size="Medium">
                    <ul class="fb-group">

                        <li>
                            <qsf:TextBox runat="server" ID="TextBox1" Size="Medium" />
                            <qsf:Button runat="server" ID="Linkbutton3" Text="Add New Entry" OnClick="Linkbutton3_Click" Size="Medium"
                                ValidationGroup="AddButton" />
                            <br />
                            <asp:RequiredFieldValidator runat="server" ID="RequiredFieldValidator1" ControlToValidate="TextBox1"
                                ValidationGroup="AddButton" ErrorMessage="Cannot add empty items.">
                            </asp:RequiredFieldValidator>
                        </li>
                        <li>
                            <qsf:Button runat="server" ID="LinkButton2" Text="Delete Last Entry" CausesValidation="False" Size="Medium" 
                               Width="145" OnClick="LinkButton2_Click" />
                        </li>
                    </ul>
                </qsf:ConfiguratorColumn>
            </qsf:View>
        </Views>
    </qsf:ConfiguratorPanel>
    </form>
</body>
</html>

Find Assistance

Help Us Improve

Was this example helpful?