Jquery Autocomplete和Spring2.5.6的问题
Problems with Jquery Autocomplete and Spring2.5.6
我正在尝试使用JQuery和Spring 2.5.6显示自动完成列表,但我正在将json发送到前端,但无法显示它。
$(function() {
$("#globalSearch").autocomplete({
source: function(request, response) {
$.ajax({
url: "${pageContext.request.contextPath}/autoSearch.htm",
data: {
term : request.term
},
dataType: "json",
contentType: "application/json; charset=utf-8",
success: function(data) {
// this is the alert output its displaying:{"list":["ernst","ernst "]}
alert(JSON.stringify(data, null, 4));
response($.map(data, function(item) {
//its not alerting anything here
alert(JSON.stringify(item, null, 4));
return{
value: item.list
};
}));
}
});
}
});
});
这是我的弹簧控制器代码:
@RequestMapping(method = RequestMethod.GET, value = "/autoSearch.htm")
public ModelAndView autoSearch(
@RequestParam(value = "term", required = false) String term
) throws ParseException, IOException {
if (logger.isDebugEnabled()) {
logger.debug("inventoryHandler called");
}
Map<String, Object> model = new HashMap<String, Object>();
int i = 0;
model.put("list", getBaseModel().getSearchServiceBean().autoCompleter(term));
return new ModelAndView("jsonView", model);
}
谁能告诉我如何显示自动完成列表吗。
提前感谢
谨致问候,Raja。
在spring3.x之后,您将使用@ResponseBody注释,例如:
public @ResponseBody List<String> autocomplete(@RequestParam(value = "term", required = false) String term) {
//Go get your results for the autocomplete term
List<String> termResults = ...;
return termResults;
}
在我看来,您的响应被发送回客户端时使用了错误的内容类型,并且被解释为text/html而不是JSON。您可以设置响应内容类型并在控制器中写入JSON字符串吗?
String json = "{'"list'":['"ernst'",'"ernst '"]}";
response.setContentType("application/json");
PrintWriter writer = response.getWriter();
response.setContentLength(json.length());
writer.write(json);
我终于找到了下面显示的解决方案。
$(document).ready(function() {
$("#globalSearch").autocomplete({
source: function(request, response) {
$.ajax({
url: "${pageContext.request.contextPath}/autoSearch.htm",
data: {
globalSearch : request.term
},
dataType: "json",
contentType: "application/json; charset=utf-8",
success: function(data) {
response($.map(data.list, function(value) {
return{
label: value,
value: value
};
}));
}
});
}
});
});
在输入字段中,名称和id必须像一样相同
<input type="text" name="globalSearch" id="globalSearch"/>
@RequestMapping(method=RequestMethod.GET,value="/autoSearch.htm")公共模型和视图自动搜索(@RequestParam(value="term",required=false)字符串术语)throws ParseException,IOException{
if (logger.isDebugEnabled()) {
logger.debug("inventoryHandler called");
}
Map<String, Object> model = new HashMap<String, Object>();
model.put("list", getBaseModel().getSearchServiceBean().searchAutoComplete(term));
return new ModelAndView("jsonView", model);
}
和在views.properties中,文件视图应该像一样设置
jsonView。(class)=org.springframework.web.servlet.view.json.json查看
在javascript中,自动完成将使用以下代码:
$("#searchEmail").autocomplete({
source: function(request, response) {
ajaxCall(request, response);
},
select: function(event, ui) {
$("#searchEmail").val(ui.item.value);
$("#emailSearch-form").submit();
}
});
function ajaxCall(request, response) {
$.ajax({
url: "${pageContext.request.contextPath}/autoSearch.htm",
data: {
term : request.term
},
dataType: "json",
contentType: "application/json; charset=utf-8",
success: function(data) {
response($.map(data.list, function(item) {
return{
label: item,
value: item
};
}));
}
});
}
相关文章:
- 在指令控制器中使用$attrs时出现问题
- 将PHP变量传递给jQuery时遇到问题
- Canvas Html5绘图应用程序,移动画布会导致重大问题
- 参数变量出现ngTable指令问题
- 剑道网格jQuery动画()问题
- 我的jQuery插件参数没有正确启动,遇到了问题
- Phonegap-(安卓/iphone)多个图像的图像库出现问题
- TableExport jquery插件:文件名和扩展名问题
- JavaScript Pub/Sub属性访问问题
- JavaScript异步问题
- 如何解决Yii中的页面刷新问题
- Safari(Mac OS)上的jQuery平滑滚动问题
- jqGrid树网格问题
- 使用正则表达式评估电子邮件地址时出现性能问题
- 如何消除代码中的未定义和其他问题
- JavaScript代码问题:我正在将对象转换为数组
- 三星智能电视应用程序;Brightcove示例应用程序远程控制问题
- 由于iframe导致的问题
- ReactJS和SpringDataRest缓存问题可能与websocket有关
- Jquery Autocomplete和Spring2.5.6的问题