如果不知道什麼是auto complete text box你可以查看google suggest或者在hotmail live中輸入收件人的那個提示今天看了一下RichXin的blog仿照他做了一個類似於hotmail或者yahoo的Auto complete 郵件地址的TextBox其實很簡單就是在TextBox的keydown的事件中用_div = documentcreateElement(DIV)然這個_div放置在Textbox的正下方這個_Div也就像是一個Panel來裝載查詢後的數據
function showPanel() <這個事件就是keydown事件{ xmlHttp=GetXmlHttpObject()if (xmlHttp==null){alert (Browser does not support HTTP Request)return} var url=GetUserEmailaspxurl=url+?keyword=+ 那個TExtBox的TextxmlHttponreadystatechange=stateChanged xmlHttpopen(GETurltrue)xmlHttpsend(null)}
在我的UserEmailaspx頁面中
SQL Query
SELECT TOP FirstName+ + LastName AS FullName PrimaryEmail from UserTable
WHERE FirstName = @Keyword OR LastName = @Keyword OR PrimaryEmail=@keyword
取到數值以後把它放到javascript中的Array然後在
string fullName =;
string Email = ;
while(datareaderread())
{
fullName += + dr[FullName] + ;
Email += + dr[PrimaryEmail] +;
}
然後ResponseWrite(callBack(new Array( + fullName +) new Array( + Email +)););
這個也就是以後的xmlHttpresponseText
然後eval(xmlHttpresponseText)
在callBack(ab)這個function中還記得我們的那個_div嗎？
首先我們要確保這個_div中沒有任何的childElement所以我們首先要清除所有的childElement因為我們默ab這兩個Array的數值應該是相對應的所以我們for(var i=; i < alength; i++)在這裡我們創建_div這個DIV的子DIV也就是a[i] b[i]放在一行裡我們可以繼續用div或者我們可以用table然後再每行裡創建onMouseOveronMouseClick事件讓他把選中的數據填寫到那個Textbox中
當點中一個行時就把b[i]寫進到TextBox中
這就是總體的Auto Complete Box
From:http://tw.wingwit.com/Article/program/net/201311/13707.html
