首页 > 代码库 > jQueryui autocomplete使用示例
jQueryui autocomplete使用示例
html标签:
<input id="province" name="province"></li><input id="city" name="city" type="text"></li>
需要引入的js文件:
<script src="js/jquery.min.js"></script><script src="js/jquery-ui.min.js"></script>
页面上的javascript代码
<script> var url = "<%=servlet.getPath() %>"; var lastXhr; $("#province").autocomplete({ minLength: 1, source: function (request, response) { var term = request.term; lastXhr = $.getJSON(url+"?beanName=ProvinceData", request, function (data, status, xhr) { if (xhr === lastXhr) { response( $.grep( data, function( item ){ if(item.indexOf(request.term)!=-1)return item; }) ); } }); }, select:function(event, ui){ $("#city").autocomplete({ minLength:1, source:function(request1,response1){ var term = request1.term; $.getJSON(url+"?beanName=CityData&province="+ui.item.value,request1,function(data1,status1,xhr1){ response1($.grep(data1,function(item){ if(item.indexOf(request1.term)!=-1)return item; })); }); } }); } });</script>
服务端的java代码:
@BeanDef(value="http://www.mamicode.com/ProvinceData",scope=PrototypeScope.class) public static Object provinceData(@BeanRef ProvinceService provinceService) throws Exception{ List<Province> provinces = provinceService.getProvinceByName(new String("")); List<String> nameList = new ArrayList<String>(); for(Province province:provinces){ nameList.add(province.getName()); } JsonModel model = new JsonModel(nameList); return model; } @BeanDef(value="CityData",scope=PrototypeScope.class) public static Object cityData(@Param("province")String province, @BeanRef ProvinceService provinceService, @BeanRef CityService cityService) throws Exception{ System.out.println(province); List<Province> provinces = provinceService.getProvinceByName(province); List<String> nameList = new ArrayList<String>(); if(provinces != null && provinces.size()==1){ List<City> cities = cityService.getCityByProvinceID(provinces.get(0).getId()); for(City city:cities){ nameList.add(city.getName()); } }else{ nameList.add(""); } JsonModel model = new JsonModel(nameList); System.out.println(model.toString()); return model; }
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。