autocomplete 加載下拉

autocomplete   就類似於百度搜索一樣的文本框。當你屬於一個a的時候下面會列出關於a的信息。

 

<input id="schoolName" name="printDto.schoolName" value="${printDto.schoolName}"//這個value是默認學校

 

需要的js

 

$(function() {
	var availableTags = getSchools();
	$( "#schoolName" ).autocomplete({
		source: availableTags
	});
});

 //判斷文本框是否是正確的學校名字。也就是下拉框的內容

function checkShooleNameExist(schoolName){
	var url = "getSchool.html?ajax=true";
	
	var params = {'schoolName':encodeURI(schoolName),'now':new Date()}
	var reulst=[];
	$.ajax({
		url: url,
		type: "POST",
		async:false,
		data:params,
		beforeSend: function(XMLHttpRequest){
			//ShowLoading();
		},
		success: function(data, textStatus){
			reulst = eval(data);					
		},
		complete: function(XMLHttpRequest, textStatus){
			//HideLoading();
		},
		error: function(){
			//請求出錯處理
		}
	});
	return reulst;
}

//用ajax讀取後臺獲取到的所有的學校
function getSchools(){
	var url = "findSchool.html?ajax=true";
		var params = {'schoolName':'','now':new Date()}
		var reulst=[];
		$.ajax({
			url: url,
			type: "POST",
			async:false,
			data:params,
			beforeSend: function(XMLHttpRequest){
				//ShowLoading();
			},
			success: function(data, textStatus){
				reulst = eval(data);					
			},
			complete: function(XMLHttpRequest, textStatus){
				//HideLoading();
			},
			error: function(){
				//請求出錯處理
			}
		});
		return reulst;
}

 

 

 我這裏用了兩個一樣的方法。只是提交不同。。額。。看上去似乎有點繁瑣哦。。沒想到別的更好的方法哦。。

 

頁面所需要的js：

<link rel="stylesheet" href="styles/jquery-ui-1.8.10.custom.css"/>
 <script src="scripts/jquery-1.4.4.min.js"></script>
 <script src="scripts/jquery.ui.core.js"></script>
 <script src="scripts/jquery.ui.widget.js"></script>
 <script src="scripts/jquery.ui.position.js"></script>
 <script src="scripts/jquery.ui.autocomplete.js"></script>

 

java代碼：獲取所有學校集合

 

public String find(){
		schools = schoolManager.getSchools(schoolName);
		JSONArray jsonArray = new JSONArray();
		for(School s :schools){
			//JSONObject obj = new JSONObject(s);
			String name  = s.getId().getXxmc();
			jsonArray.put(name);
		}
		try {
			printTextToClient(jsonArray.toString());
		} catch (Exception e) {
			log.debug("method:[find] err:"+e.getMessage());
			e.printStackTrace();
		}
		return null;
	}
	public String get(){
		
		try {
			schoolName = java.net.URLDecoder.decode(schoolName,"UTF-8");
		} catch (UnsupportedEncodingException e1) {
			e1.printStackTrace();
		}
		schools = schoolManager.findSchool(schoolName);
		JSONArray jsonArray = new JSONArray();
		for(School s :schools){
			//JSONObject obj = new JSONObject(s);
			String name  = s.getId().getXxmc();
			jsonArray.put(name);
		}
		try {
			printTextToClient(jsonArray.toString());
		} catch (Exception e) {
			log.debug("method:[find] err:"+e.getMessage());
			e.printStackTrace();
		}
		return null;
	}
	/**
     * 將結果返回給xmlRequest
     * 
     * @param s
     * @param dictList
     * @return
     * @throws Exception
     */
    public void printTextToClient(String result) throws Exception {
    	getResponse().setContentType("text/html;charset=gbk");
    	getResponse().setCharacterEncoding("gbk");
        PrintWriter out = getResponse().getWriter();
        try {
            out.print(result);
        } finally {
            out.close();
        }
    } 

 

這裏get 和find 方法沒什麼差的。。。所以有點糾結

 

struts配置

 <action name="*School" class="schoolAction" method="{1}">
            <result name="success" type="redirect-action">ajaxAction</result>
        </action>