easyui 將後臺已有的值傳回select輸入框內 並在點擊下拉框時顯示選中(支持多選)

原理:用ajax獲取選中的值,把選中的值放入指定select下即可。

第一步,確定傳回前臺的Json,代碼如下:

獲取下拉框選中的值:

	@RequestMapping("/test")
	@ResponseBody
	public String atest(HttpServletRequest request,
			HttpServletResponse response) {
		List<String> list = new ArrayList<String>();
		list.add("Java");
		list.add("Perl");
		return MyJSON.obj2JSON(list);
	}

獲取下拉框所有值:

@RequestMapping("/testall")
	@ResponseBody
	public String atestall(HttpServletRequest request,
			HttpServletResponse response) {	   
		String[] stringss = {"Java","Perl","Ruby"};
		List<Map<String, String>> strings = new ArrayList<Map<String, String>>();	    
		for (int i = 0; i < stringss.length; i++) {
			Map<String, String> map = new HashMap<String, String>();
			map.put("label", stringss[i]);
		    map.put("value", stringss[i]);
		    strings.add(map);
		}			   
		return MyJSON.obj2JSON(strings);
	}

其中,MyJSON爲obj轉JSON工具類,詳情見下方。

import java.text.SimpleDateFormat;


import org.codehaus.jackson.map.ObjectMapper;
import org.codehaus.jackson.map.SerializationConfig;


/**
 * @projectName:mysis_v2013.3
 * @className:MyJSON
 * @description:JSON類工具
 * @author:LeoLee
 * @date:2013-11-11 下午09:35:30
 * @version:
 */
public class MyJSON {
	
	/**
	 * @title: obj2JSON 
	 * @description: 將Object轉換成JSON
	 * @param obj
	 * @throws Exception
	 * @return String
	 * @throws
	 */
	public static String obj2JSON( Object obj )  {
		try {
			ObjectMapper objectMapper = new ObjectMapper();
			
		    objectMapper.configure(SerializationConfig.Feature.WRITE_DATES_AS_TIMESTAMPS, false); 
		    
		    SimpleDateFormat formatter = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss");  
		    
		    objectMapper.setDateFormat(formatter);
		    
			return objectMapper.writeValueAsString(obj);
		} catch (Exception e) {
			return "";
		}		
	}
}

第二步,前臺頁面寫好對應select

<select id="ccas" class="easyui-combobox" name="dept1" style="width:200px;">                       
</select> 

第三步,寫對應js

     獲取下拉框選中的值:

$.post("/test",function(data,textStatus,jqxhr){	
		abc(data);		
	},"json");

     獲取下拉框中所有值並顯示的方法:

function abc(vvalue){
	$('#ccas').combobox({    
	    url:"selecttest/testall",
	    valueField:'label',    
	    textField:'value',
	    multiple:true,
	    panelHeight:'auto',
	    value:vvalue	    
	});  
}

效果圖:


注:obj轉json非原創

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章