对于数据量庞大的下拉菜单建立对应的联想查询

标签：数据简单的联想查询

*效果展示：【如图左边为项目信息的下拉菜单，在其右边有一个输入框。实现效果在右边输入框的位置，输入“A”，在昨天的下拉框信息中值显示“A”对应的信息】

*功能实现：

【jsp页面功能实现：】

获取你要的所有项目信息

<%
	List project_list = (List)request.getAttribute("project_list");
%>

<SCRIPT LANGUAGE="JavaScript">
	//将所有的项目信息存放到数组中.
	var array_pro 	= new Array();
	
	<s:set name="proOrder" value="0"/>
	<s:iterator value="#request.project_list">
		array_pro['<s:property value="#proOrder"/>']=new Array('<s:property value="PRO_ID"/>','<s:property value="PRO_NAME"/>');
		<s:set name="proOrder" value="#proOrder+1"></s:set>
	</s:iterator>

	function getList(proname){
		
		if(proname != '' && proname != '请输入项目名称'){
			
			var new_proarry = new	 Array();
			var regu   	=   proname;  
		   	var re   	=   new   RegExp(regu);
		   	var new_order=0;
		   	
		   	for(var i=0;i<array_pro.length;i++){
		   	
			    if(array_pro[i][1].search(re)!=-1){
			    	new_proarry[new_order]=array_pro[i];
			    	new_order=new_order+1;	   
			    }
			}
			var str_pro		=	"";

			$("select[id='PRO_ID'] option").remove();
			
			if(new_proarry.length==0){
				str_pro="<option value=\"\">--请选择项目--</option>";
				$('#PRO_ID').append(str_pro);
				return false;
			}
			
			for(var i = 0; i < new_proarry.length; i++) {
				str_pro+="<option value="+ new_proarry[i][0]+">"+new_proarry[i][1]+"</option>";
			}
			$('#PRO_ID').append(str_pro);
		}
		else{
			new_proarry=array_pro;	

			$("select[id='PRO_ID'] option").remove();
			var str_pro="<option value=\"\">--请选择项目--</option>";
			for(var i = 0; i < new_proarry.length; i++) {
				str_pro+="<option value="+ new_proarry[i][0]+">"+new_proarry[i][1]+"</option>";
			}
			$('#PRO_ID').append(str_pro);
		}
	}
</script>

<tr class="fontSy">      
         <td height="25" align="center"><font color="red" >*</font>项目名称</td>
        <td  height="25" align="left"> 
          <s:select list="#request.project_list"
						  listKey="PRO_ID"
						  listValue="PRO_NAME"
						  theme="simple"
						  name="PRO_ID"
						  id="PRO_ID"
						  headerKey=""
						  headerValue="--请选择项目--"
						  cssStyle="width:300px;"
				/>
		<input value="请输入项目名称" onclick="if(this.value=='请输入项目名称') this.value=''" 
        	onblur="if(this.value=='') this.value='请输入项目名称';"
        	style="border:none;width:100px;color: red;" onkeyup="getList(this.value);">	
        </td>
        </td>

</tr>

对于数据量庞大的下拉菜单建立对应的联想查询

标签：数据简单的联想查询

原文地址：http://blog.csdn.net/u013806366/article/details/41723807