下面是Jquery 自动完成的一个实例,希望对大家有帮助。。。。
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Aotocomplete.aspx.cs" Inherits="_Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Aotocomplete</title>
<link href="css/jquery.autocomplete.css" mce_href="css/jquery.autocomplete.css" rel="stylesheet" type="text/css" />
<mce:script type="text/javascript" src="js/jquery.js" mce_src="js/jquery.js"></mce:script>
<mce:script type="text/javascript" src="js/jquery.autocomplete.js" mce_src="js/jquery.autocomplete.js"></mce:script>
<mce:script type="text/javascript"><!--
$().ready(function () {
function formatItem(row) {
return " <p>" + row[0] + " </p>" + " <span class='span1'>" + row[1] + "</span>";
}
function formatResult(row) {
return row[0].replace(/(<.+?>)/gi, '');
}
$("#txttitle").autocomplete("ashx/Search.ashx",
{
delay: 10,
matchSubset: 1,
matchContains: 1,
cacheLength: 10,
formatItem: formatItem,
formatResult: formatResult,
width: 300
}
);
});
// --></mce:script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:TextBox ID="txttitle" runat="server" Style="width: 296px; height: 20px" mce_Style="width: 296px; height: 20px"
MaxLength="12"></asp:TextBox>(一种)
</div>
</form>
</body>
</html>
下面是Search.ashx的代码。。。
<%@ WebHandler Language="C#" Class="Search" %>
using System;
using System.Web;
using System.Data;
using System.Data.SqlClient;
public class Search : IHttpHandler {
public void ProcessRequest (HttpContext context) {
string key = context.Request.QueryString["q"];
SqlConnection conn = new SqlConnection("server=.;database=Test;uid=sa;pwd=sasa");
string sql = "select kemo from Info where kemo like '%" + key + "%'";
SqlDataAdapter da = new SqlDataAdapter(sql, conn);
DataSet ds = new DataSet();
da.Fill(ds, "congInfo");
DataTable dt = ds.Tables[0];
string xml = "";//加一个请选择的选项
foreach (DataRow row in dt.Rows)//循环读取值,并且以XML格式输出
{
xml += "" + row["kemo"] + "|" + "/n";
}
context.Response.ContentEncoding = System.Text.Encoding.UTF8;
context.Response.Write(xml);
}
public bool IsReusable {
get {
return false;
}
}
}
这样就行了,希望大家给予评价。。。。。