AutoComplete using JQuery

This is an example application to use auto complete option using jquery

Below is the aspx code

<html xmlns="">
<head runat="server">
<link href="" rel="stylesheet" type="text/css"/>
<script type="text/javascript" src=""></script>
<script type="text/javascript" src=""></script>
<script type="text/javascript">
$(function() {
source: function(request, response) {
url: "EmailList.asmx/MailingIDs",
data: "{ 'mail': '" + request.term + "' }",
dataType: "json",
type: "POST",
contentType: "application/json; charset=utf-8",
dataFilter: function(data) { return data; },
success: function(data) {
response($.map(data.d, function(item) {
return {
value: item.Email
error: function(XMLHttpRequest, textStatus, errorThrown) {
minLength: 2
<form id="form1" runat="server">
<div class="demo">
<div class="ui-widget">
<label for="tbAuto">Enter Email: </label>
<asp:TextBox ID="tbAuto" class="tb" runat="server">

The above code fetches emails from the EmailList.asmx file. the below code for asmx page

public List MailingIDs(string mail)
var emp = new Employee();
var fetchEmail = emp.GetEmployeeList()
.Where(m => m.Email.ToLower().StartsWith(mail.ToLower()));
return fetchEmail.ToList();

Here the MailingIDs(string mail) method calls the GetEmployeeList() method on the Employee class which returns a List. We then filter the list using the filter string (mail) passed from the UI and then return the list of emails that match the filter string.

Related Articles

More articles: JQuery Ajax


Guest Author: shiek28 May 2013

its great working for me..Thanks

  • Do not include your name, "with regards" etc in the comment. Write detailed comment, relevant to the topic.
  • No HTML formatting and links to other web sites are allowed.
  • This is a strictly moderated site. Absolutely no spam allowed.
  • Name: