在组件上面用keyup事件来监听
<ext:panel width="210" layout="form" listeners="{afterlayout:onUIShow}" style="margin-left:10px">
<ext:items>
<ext:textField id="query_title333" var="query_title333" fieldLabel="${app:i18n('knowledge.document.search')}"
width="125" listeners="{specialkey:doFileQuery,keyup:inputSuggest}" enableKeyEvents="true" />
</ext:items>
</ext:panel>
js代码
--回车查询
function doFileQuery(o,e){
if(e.getKey()==13){
onFileSearch();
}
}
--搜索提示核心代码
function inputSuggest() {
var txtValue = query_title333.getValue();
var str = "";
Ext.Ajax.request({
params: {txtValue:encodeURI(txtValue)},
url: "../kbssuggest/findSuggestByValue.action",
success:function(response) {
var resp=Ext.util.JSON.decode(response.responseText);
if(resp.suggestReslut!="")
str = resp.suggestReslut.split("#");
createDiv(str);
}
});
}
function onmouseOver1(div) {
div.style.background="#99BBE8";
div.style.color="white";
}
function onmousetOut1(div) {
div.style.background="#F2F4F4";
div.style.color="black";
}
function setSuggestValue(value) {
query_title333.setValue(value);
}
function createDiv(str){
var pop=window.createPopup();
var len=0;
if(null!=str&&''!=str){
len=str.length;
}
//设置弹出菜单的内容"+id+"
//var menuDiv = '<table width="100%" height="100%" cellspacing="0" cellpadding="0" style="border: 1px solid #4482D3; background: #F2F4F4;font-size: 9pt;">';
var menuDiv='<div class="FONT-SIZE:11pt;font-style: 黑体;font-weight: bold;COLOR:#000000;BACKGROUND-REPEAT:repeat;BACKGROUND-ATTACHMENT:scroll;width:30%;position: absolute;overflow:hidden;z-index: 1000;"><iframe style="position:absolute;z-index:-1;width:100%;height:100%;background-color:green;top:0;left:0;scrolling:no;" frameborder="0" src="about:blank" mce_src="about:blank"></iframe>';
for(i=0; i < len - 1; i++) {
//menuDiv +='<tr><td style="cursor:hand; height: 16px;padding: 2px;padding-left:5px;" align="left" οnclick="parent.setSuggestValue(this);" >'
menuDiv += '<div οnmοuseοver="parent.onmouseOver1(this);" ';
menuDiv += 'οnmοuseοut="parent.onmousetOut1(this);" ';
menuDiv += 'οnclick="parent.setSuggestValue(this.innerHTML);" ';
menuDiv += 'style="background-color: #FFFFFF;padding: 2px 6px 2px 6px;">' + str[i] + '</div>';
//menuDiv +=str[i] +'</td></tr>';
}
menuDiv+='</div>';
// menuDiv += '</table>';
pop.document.body.innerHTML =menuDiv;
//选择右键菜单的一项后,菜单隐藏
pop.document.οnclick=function(){
pop.hide();
}
//得到当前坐标
var e=document.getElementById('query_title333');
var t=e.offsetTop;
var l=e.offsetLeft;
while(e=e.offsetParent)
{
t+=e.offsetTop;
l+=e.offsetLeft;
}
//调整弹出窗口的高度
var high=len*15;
if(len>4&&len<=7){
high=len*18;
}else if(len>7){
high=len*20;
}
pop.show(l+56,t*2.7,130,high,document.body);
}