用ajax創建autosuggest文本框

我想用ajax創建autosuggest文本框。寫完一些字符後，它會返回電子郵件地址。從DB中的那些字符開始。這應該在JSP中開發。任何人都有想法嗎？用ajax創建autosuggest文本框

2011-02-06 Mayur Patel

待辦事項如下：

在javascript：

function getValue(str){ 
    if (window.XMLHttpRequest) 
    { 
    xmlhttp=new XMLHttpRequest(); 
    } 
else 
    { 
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
    } 
url = url +"?" +str; 
xmlhttp.open("POST",url_to_get_db_data,false); 
xmlhttp.send(null); 
document.getElementById('id_of_div').innerHTML=xmlhttp.responseText; 
document.getElementById('id_of_div').style.display = "block"; 
}

和HTML：

<input onkeypress="getValue(this.value)"/> //--- this will be your input text 
<div id="id_of_div" style="display:none;"> //--- this is your autosuggest box which will appear down to textbox. Use css to show it at proper location. 
</div>

格式的DIV看起來像一個自動提示框。使用css來實現這一點。

此外，當用戶選擇從自動提示框調用Java腳本功能，並在服務器端以下 document.getElementById('id_of_div').style.display = "none";

編輯

，當你得到數據庫列表做如下一個選項：

for(Iterator it=db_list.iterator();it.hasNext();) 
    { 
     Object obj = (Object) it.next(); 
     String value = obj.getValue(); 
     out.print(value+"<br>"); 
    }

希望這有助於。

來源

2011-02-06 16:45:14

@Mayur的列表：我已經編輯我的問題進行更多的瞭解。看看 – 2011-02-06 17:00:06

感謝哈里....在那個網址應該是什麼邏輯比較DB中的每個字符通過'喜歡％'，並在最後我會得到那些清單...我們高清設置列表smwhere？你能以這種方式解釋我嗎？...... – 2011-02-06 17:08:37

我建議看看jQuery UI附帶的autocomplete plugin。

看看他們的official demo它說明它是如何工作的。

來源

2011-02-06 16:45:24

您是否看過將jQuery UI與您的Web應用程序集成？ jQuery的UI具有自動完成/建議插件http://docs.jquery.com/Plugins/autocomplete

這是阿賈克斯和所有你需要做的只是提供話

來源

2011-02-06 16:47:09 Nilesh

用ajax創建autosuggest文本框

回答

相關問題