javascript 异步页面查询实现代码(asp.net)

1。 testlist.aspx页面：

复制代码代码如下:

 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
<title></title> 
<link rel="stylesheet" href="jscript/autoSuggest.css" type="text/css"/> 
<link rel="stylesheet" href="jscript/ac.css" type="text/css"/> 
<script language="Javascript" src="jscript/autoSuggest.js"></script> 
<script language="Javascript" src="jscript/ac.js"></script> 
function ACClient( queryurl, width, objInput, objLable ) 
{ 
this.xmldom = getXmlhttp(); 
this.queryurl = queryurl; 
this.prolist = new Array(); 
this.divwidth = width; 
this.objInput = objInput; 
this.getEligible = function(ac) { 
var eligible = new Array(); 
if (ac.inputText.length < 1) { 
document.getElementById(objInput.name).value = ""; 
document.getElementById(objLable.name).value = ""; 
return eligible; 
} 
var strURL = this.queryurl + escape(ac.inputText) + "&rand=" + Math.random(); 
this.xmldom.open("GET", strURL, false); 
try { 
this.xmldom.send(); 
} 
catch (e) { 
return; 
} 
this.prolist = this.xmldom.responseXML.documentElement.selectNodes("/duxion/object"); 
if (0 == this.prolist.length) { 
return eligible; 
} 
for (var i = 0; i < this.prolist.length; i++) { 
if (i > 15) 
break; 
var node = this.prolist.item(i); 
eligible[eligible.length] = node.getAttribute("fullcontent"); 
} 
ac.div.style.width = this.divwidth; 
return eligible; 
}; 
this.useSuggestion = function( sel ) 
{ 
if( sel>=0 ) 
{ 
var node = this.prolist.item(sel); 
if(typeof(node.getAttribute( "value" )) != "undefined") 
document.getElementById(objInput.name).value = node.getAttribute( "value" ); 
else 
document.getElementById(objInput.name).value = ""; 
if(typeof(node.getAttribute( "content" )) != "undefined") 
document.getElementById(objLable.name).value = node.getAttribute( "content" ); 
else 
document.getElementById(objLable.name).value = ""; 
if (this.objInput.name == "hidfreq_code") { 
document.getElementById("txtfreq_name").value = node.getAttribute("Name"); 
document.getElementById("hidfreq_code").value = node.getAttribute("Code"); 
} 
} 
}; 
return this; 
} 
</script> 
</head> 
<body> 
<form id="form1" runat="server"> 
<%--div 用于显示下拉查询部分--%> 
<div id="autosuggest" style="width:160px;font-size:12px;"><ul></ul></div> 
<div> 
<asp:TextBox ID="txtfreq_name" CssClass="needtext" runat="server" Width="100px"></asp:TextBox><asp:HiddenField 
ID="hidfreq_code" runat="server" /> 
</div> 
</form> 
</body> 
</html> 
<script type="text/javascript"> 
new AutoSuggest(document.getElementById('txtfreq_name'), 
new ACClient("testXml.aspx?tag=yp_frequency&value=", "200px", document.getElementById('hidfreq_code'), document.getElementById('txtfreq_name'))); 
</script> 

2。供查询的xml的testxml.aspx.cs文件

复制代码代码如下:

 
public partial class testXml : BaseForm 
{ 
protected void Page_Load(object sender, EventArgs e) 
{ 
ListXmlData(); 
} 
private string[] arrwidth; 
private string[] arrfield; 
public string fieldlist = "区域Id,区域名,区域编码,区域层次"; 
public string coloumwidth = "60,10,20,30"; 
//显示xml格式数据 
private void ListXmlData() 
{ 
//各字段的宽度 
string strwhere=""; 
if (Request["value"] != null) 
{ 
strwhere = string.Format(" and Code like '{0}%'", Request["value"].ToString()); 
} 
arrfield = fieldlist.Split(','); 
arrwidth = coloumwidth.Split(','); 
DataTable dtList = new Districts().Search("1=1" + strwhere);// dis // SqlHelper.GetTable(subsys_db, CommandType.Text, strsql, null); 
int list_cols = dtList.Columns.Count; //字段数 
int list_rows = dtList.Rows.Count; //记录数 
string listlable = ""; //显示内容 
XmlDocument xmldoc = new XmlDocument(); 
XmlDeclaration dec = xmldoc.CreateXmlDeclaration("1.0", "gb2312", null); 
xmldoc.InsertBefore(dec, xmldoc.FirstChild); 
XmlElement root = xmldoc.CreateElement("duxion"); 
xmldoc.AppendChild(root); 
//显示表头 
if (list_rows > 0) 
{ 
XmlElement objtitle = xmldoc.CreateElement("object"); 
for (int k = 0; k < list_cols; k++) 
{ 
listlable += "<span style='width:" + arrwidth[k] + ";text-align:center;font-weight:bold;color:#000000;padding-top:2px;'>" + arrfield[k] + "</span>"; 
if (k == arrfield.Length - 1) 
break; 
} 
objtitle.SetAttribute("fullcontent", listlable); 
root.AppendChild(objtitle); 
} 
//显示表头 
//显示数据 
for (int i = 0; i < list_rows; i++) 
{ 
listlable = ""; 
DataRow drList = dtList.Rows[i]; 
XmlElement obj = xmldoc.CreateElement("object"); 
for (int j = 0; j < list_cols; j++) 
{ 
obj.SetAttribute(dtList.Columns[j].ColumnName, drList[j].ToString()); 
if (j <= arrfield.Length - 1) 
{ 
//listlable += "<span style='width:" + arrwidth[j] + "'>" + GetLeftString(drList[j].ToString(), Convert.ToInt16(arrwidth[j])) + "</span>"; 
listlable += "<span style='width:" + arrwidth[j] + "'>" + formatXmlNode(dtList.Columns[j].DataType.ToString(), drList[j].ToString()) + "</span>"; 
} 
} 
obj.SetAttribute("fullcontent", listlable); 
root.AppendChild(obj); 
} 
//显示数据 
//Response.ContentType = "text/xml;charset=utf-8"; 
//Response.ContentType = "text/xml;charset=gb2312"; 
Response.ContentEncoding = System.Text.Encoding.Default; 
Response.ContentType = "text/xml"; 
Response.Clear(); 
Response.Write(xmldoc.OuterXml); 
Response.End(); 
} 
private string formatXmlNode(string field_type, string field_value) 
{ 
string return_value = field_value.Trim(); 
switch (field_type) 
{ 
case "System.Double": 
case "System.Decimal": 
return_value = string.Format("{0:0.###}", Convert.ToDouble(return_value)); 
break; 
} 
return return_value; 
} 
} 

3.效果图：

4。另外的.js以及.css文件见附件

«
»

PHP教程

PHP简介 PHP基本语法 PHP类型 PHP变量 PHP运算符 PHP控制结构 PHP函数 PHP类与对象 PHP异常处理函数库分类