輸入框中輸入漢字時自動聯想相似資料方法使用小結
今天在專案中用到單位輸入時,和後臺資料庫中的若有相關的就以聯想形式提示出來,
所要聯想的是與這個專案相關的另一個專案中的資料,這種情況下就是需要建立介面供其他專案來呼叫了。
我實現這個功能的步驟是這樣的:
1.先在Mapper.xml中寫有關sql 語句;
2.在Mapper.java 中寫方法: List<Org> getOrgByChnameAndTop(@Param("chname") String chname,@Param("top") int top);
3.在與另一個專案對應的controller中建立對應的介面。
public String getOrgByChname(HttpServletRequest request,
HttpServletResponse response) {
String chname = RequestUtil.getString(request, "chname", null);
int num= RequestUtil.getInt(request, "num", null);
try {
chname = java.net.URLDecoder.decode(chname,"utf-8");
} catch (Exception e1) {
// TODO Auto-generated catch block
e1.printStackTrace();
}
Map<String, Object> map = new HashMap<String, Object>();
int result = -1;
try {
List<Org> org = new ArrayList<Org>();
org=orgMapper.getOrgByChnameAndTop(chname,num);
map.put("org", org);
result = 1;
} catch (Exception e) {
e.printStackTrace();
}
map.put("result", result);
output(response, JSONObject.fromObject(map).toString());
return null;
}
4.在所要呼叫這個介面的專案中來與這個介面結合,就是另外寫一個專門用來接收外來介面的serivce
public static JSONObject getOrgLabelValueDTOByChame(String chname) {
List<LabelValueDTO> labelValueDTOList = new ArrayList<LabelValueDTO>();
String orgstr="";
String orgurl="http://"+Constant.CHRITYDATA+"/service/personage/getOrgByChname?chname="
+chname+"&num="+Constant.TOP;
try {
orgstr=CommunalController.readContentFromGet(orgurl);
} catch (IOException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
JSONObject strmap = JSONObject.fromObject(orgstr);
return strmap;
}
5.然後就是在controller中呼叫這個介面
public String getUnitByName(HttpServletRequest request, HttpServletResponse response, Model model){
String unitName=RequestUtil.getString(request, "unitName", null);
JSONObject orgList=FacadeNpoService.getOrgLabelValueDTOByChame(unitName);
super.output(response, orgList.toString());
return null;
}
6.最後就是在頁面的就是中來呼叫
$("#unit").autocomplete({
source : function(request, response ) {
$.ajax({
url: "/admin/main/getunitbyname",
data: {unitName : $("#unit").val()},
type : "GET",
dataType: "json",
cache:false,
success: function(data) {
response( $.map( data.org, function( item ) {
return {
value: item.chname
}
}));
}
});
},
minLength : 1,
select: function(event, ui) {
$("#unit").val(ui.item.value);
return false;
},
focus: function(event, ui) { return false; }
});
總體的就是這些,細節內容慢慢來看