Auto Complete Textbox using ASP.NET Ajax Control ToolKit

2011-08-15

1. Add asp.net ajax control tool kit to the web project
2. Register the ajax in the page
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajax" %>
3. Add tab in visual studio for control tool kits
4. Drag the ToolkitScriptManager to the page.
5. Create an extender control for the textbox
i.e
<asp:TextBox ID="txtCustomerEmailID" runat="server"></asp:TextBox>



<ajax:AutoCompleteExtender ID="txtCustomerEmailID_AutoCompleteExtender"

runat="server"

TargetControlID="txtCustomerEmailID"

MinimumPrefixLength="1"

EnableCaching="true"

CompletionSetCount="1"

CompletionInterval="1000"

ServiceMethod="GetCustomerEmailIDSList"

>

</ajax:AutoCompleteExtender>


TargetControlID - The TextBox control where the user types content to be automatically completed.

EnableCaching- Caching is turned on, so typing the same prefix multiple times results in only one call to the web service.

MinimumPrefixLength- Minimum number of characters that must be entered before getting suggestions from the web service.

CompletionInterval - Time in milliseconds when the timer will kick in to get suggestions using the web service.

CompletionSetCount - Number of suggestions to be retrieved from the web service.

5. Create a webservice method in the page
i.e

<System.Web.Services.WebMethodAttribute(), System.Web.Script.Services.ScriptMethodAttribute()>

  Public Shared Function GetCustomerEmailIDSList(ByVal prefixText As String) As List(Of String)

      Dim ObjPMSRequestDTO As ClsPMSRequestDTO = New ClsPMSRequestDTO()

      Dim ObjPMSFacade As IAbstractPMSFacade = New PMSFacade()

      Dim lstCustomerCustomersEmailIDS As List(Of String) = New List(Of String)

      ObjPMSRequestDTO.Request = CType(HttpContext.Current.Session("SessionHandlerComponent"),



ClsSessionHandlerComponent).Request.Clone()

      ObjPMSRequestDTO.CustomerEmailID = prefixText

      lstCustomerCustomersEmailIDS = ObjPMSFacade.ProcessGetAllCustomersEmailID(ObjPMSRequestDTO)

      Return lstCustomerCustomersEmailIDS



  End Function



0 comments: