Jquery 自動完成例項
阿新 • • 發佈:2019-01-29
下面是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; } } }
這樣就行了,希望大家給予評價。。。。。