Default.aspx
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Untitled Page</title>
<link href="css/jquery.autocomplete.css" rel="stylesheet" type="text/css" />
<script src="scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
<script src="scripts/jquery.autocomplete.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#<%=txtSearch.ClientID%>").autocomplete("Search.ashx", {
width: 200,
formatItem: function(data, i, n, value) {
return "<img style = 'width:50px;height:50px' src= Images/" + value.split(",")[1] + "'/> " + value.split(",")[0];
},
formatResult: function(data, value) {
return value.split(",")[0];
}
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:TextBox ID="txtSearch" runat="server" Width = "195"></asp:TextBox>
</div>
</form>
</body>
</html>
Default.aspx.CS
<%@ WebHandler Language="C#" Class="Search" %>
using System;
using System.Data.SqlClient;
using System.Text;
using System.Web;
public class Search : IHttpHandler {
public void ProcessRequest (HttpContext context)
{
string searchText = context.Request.QueryString["q"];
SqlConnection con = new SqlConnection("connection string");
con.Open();
SqlCommand cmd = new SqlCommand("select UserId,UserName,ImageName from UserImageDetails where UserName Like @Search + '%'", con);
cmd.Parameters.AddWithValue("@Search",searchText);
StringBuilder sb = new StringBuilder();
using(SqlDataReader dr=cmd.ExecuteReader())
{
while(dr.Read())
{
sb.Append(string.Format("{0},{1}{2}",dr["UserName"],dr["ImageName"],Environment.NewLine));
}
}
con.Close();
context.Response.Write(sb.ToString());
}
public bool IsReusable
{
get
{
return false;
}
}
} 