第二次 请教 jquery.autocomplete 问题。 谢谢

[请叫我带角凹凸曼]

模拟数据。
var emails = [
{ name: "Peter", to: "peter" },
{ name: "Molly", to: "[e-mail]" },
{ name: "Forneria Marconi", to: "[e-mail]" },
{ name: "Master <em>Sync</em>", to: "[e-mail]" },
{ name: "Dr. <strong>Tech</strong> de Log", to: "[e-mail]" },
{ name: "Don Corleone", to: "[e-mail]" },
{ name: "Mc Chick", to: "[e-mail]" },
{ name: "Donnie Darko", to: "[e-mail]" },
{ name: "Quake The Net", to: "[e-mail]" },
{ name: "Dr. Write", to: "[e-mail]" },
{ name: "GG Bond", to: "[e-mail]" },
{ name: "Zhuzhu Xia", to: "[e-mail]" }
];


前台 js

// 联想数据
//$("#suggestionName").autocomplete(emails ,
$("#suggestionName").autocomplete('search',
{
matchContains: true,
minChars: 0,
scroll: false,
scrollHeight: 500,
width: 400,
extraParams: {name:function(){
return $('#suggestionName').val();
}},
dataType: "json",
mustMatch:false,
parse: function(data) {
return $.map(data, function(row) {
return {
data: row,
value: row.name,
result: row.name
}
});
},
formatItem: function(data,i,max) {
// 得到返回的json数据
return data.name + data.to;
}
}).result(function(data) {
return data.name;
});
});


html：
<input type="text" name="suggestionName" id="suggestionName" class="noneinput"/>


上面联想数据，input 下面能正常显示所有数据.


我在后台 返回json数据，就不能显示后台返回的数据。（map的返回json数据，不行。 key不能重复，我在前台不清楚怎么处理，显示所有数据到input下，所有我就返回list的json数据。 但是不能联想处理）

Java代码

// 创建map 存放json需要的数据
Map<String, Object> map = new HashMap<String, Object>();

// 模拟的list数据
List<String> list = new ArrayList<String>();
list.add("name: PeterPan,to: ss");
list.add("name: PeterPan,to: ss");
list.add("name: PeterPan,to: ss");
list.add("name: PeterPan,to: ss");
// 以前的map，前台只能得到一个。 key不能重复，我想把key+i,然后在返回数据的时候，去掉数字。 但是前台只能显示一条数据。
if(comList != null)
{
for (int i = 0; i < comList.size(); i++)
{
map.put("name", comList.get(i).getCompanyName() +" "+ comList.get(i).getCompanyInfo());
}
}

getResponse().setContentType("ext/json;charset=UTF-8");
// 转换成json数据
JSONArray jsonArray = JSONArray.fromObject(list);

PrintWriter out = this.getPrintWriter();

getResponse().setCharacterEncoding("UTF-8");

// 正常得到list的json数据
out.write(jsonArray.toString());
out.flush();
out.close();

[Thomas.Sir]

var emails = [ { name: "Peter", to: "peter" }, { name: "Molly", to: "[e-mail]" }, { name: "Forneria Marconi", to: "[e-mail]" }, { name: "Master <em>Sync</em>", to: "[e-mail]" }, { name: "Dr. <strong>Tech</strong> de Log", to: "[e-mail]" }, { name: "Don Corleone", to: "[e-mail]" }, { name: "Mc Chick", to: "[e-mail]" }, { name: "Donnie Darko", to: "[e-mail]" }, { name: "Quake The Net", to: "[e-mail]" }, { name: "Dr. Write", to: "[e-mail]" }, { name: "GG Bond", to: "[e-mail]" }, { name: "Zhuzhu Xia", to: "[e-mail]" } ]; 这些Json数据中间有逗号的，建议在后台重新封装JSON格式的数据，然后再输出前台。 for (int i = 0; i < comList.size(); i++) { //这句代码看看在哪个地方加个逗号 map.put("name", comList.get(i).getCompanyName() +" "+ comList.get(i).getCompanyInfo()); }

[花谢尊前不敢香]

getResponse().setContentType("ext/json;charset=UTF-8"); 这个写错了吧。

[computerclass]

先在地址栏运行...json ，首先看json能不能显示出来

[请叫我带角凹凸曼]

引用 3 楼 fangmingshijie 的回复:

getResponse().setContentType("ext/json;charset=UTF-8"); 这个写错了吧。

写成什么？ map类型的json前台能获取值。 list的不能. 不解怎么回事

[请叫我带角凹凸曼]

引用 2 楼 SearchB 的回复:

var emails = [ { name: "Peter", to: "peter" }, { name: "Molly", to: "[e-mail]" }, { name: "Forneria Marconi", to: "[e-mail]" }, { name: "Master <em>Sync</em>", to: "[e-mail]" }, { name: "Dr. <strong>Tech</strong> de Log", to: "[e-mail]" }, { name: "Don Corleone", to: "[e-mail]" }, { name: "Mc Chick", to: "[e-mail]" }, { name: "Donnie Darko", to: "[e-mail]" }, { name: "Quake The Net", to: "[e-mail]" }, { name: "Dr. Write", to: "[e-mail]" }, { name: "GG Bond", to: "[e-mail]" }, { name: "Zhuzhu Xia", to: "[e-mail]" } ]; 这些Json数据中间有逗号的，建议在后台重新封装JSON格式的数据，然后再输出前台。 for (int i = 0; i < comList.size(); i++) { //这句代码看看在哪个地方加个逗号 map.put("name", comList.get(i).getCompanyName() +" "+ comList.get(i).getCompanyInfo()); }

map类型的前台能取到。 跟逗号没有关系。 我现在出现的问题是： map的key不能重复，所以前台只能取一个。 我想办法转换成list然后转换成json传过去，但是前台不能获取数据。

[teemai]

autocomplete是要key， value格式。你前台当然需要key-value

[花谢尊前不敢香]

引用 4 楼 wy562530802 的回复:

[quote=引用 3 楼 fangmingshijie 的回复:] getResponse().setContentType("ext/json;charset=UTF-8"); 这个写错了吧。

写成什么？ map类型的json前台能获取值。 list的不能. 不解怎么回事[/quote]有ext/json这个内容类型？

[teemai]

这是我项目中用到的，后台传的json过来，你在前台再封装成需要的格式，供你参考

$.ajax({
				type : "GET",
				url : url,
				dataType : "JSON",
				data : {
					"name" : keyword
				},
				success : function(data) {

					console.log("type:" + type);

					if (type == "think") {
						if (data != null && data.length > 0) {
							var availableNames = [];
							for (var i = 0; i < data.length; i++) {
								var item = {};
								item["label"] = data[i].name + ", "
										+ data[i].address;
								item["value"] = data[i].name;
								item["key"] = data[i].id;
								availableNames.push(item);
							}
							$("#merchantName").autocomplete({
								minChars : 0,
								source : availableNames,
								delay : 1000,
								select : function(event, ui) {
									$.ajax({
												type : "GET",
												url : "/merchant",
												dataType : "JSON",
												data : {
													"id" : ui.item.key
												},
												success : function(data) {
													console.log(data);
													console.log(data.id);
													$("#mid").val(data.id);
													$("#description")
															.val(data.description);

													// add merchant image here
													$("#address")
															.val(data.address);
													$("#x").val(data.x);
													$("#y").val(data.y);

													$("#tel")
															.val(data.telephone);
													$("#cityCode")
															.val(data.cityCode);
													Merchant.enableEdit();
												},
												error : function() {
													alert("服务器维护中，马上就好。");
												}
											});
								}
							});
						}
					}

					if (type == "check") { // 检查是否有同名商家
						console.log(data);
						if (data != null && data.length > 0) {
							$("#tips").html("已经有同名的商家了，请换个名称").show();
						} else {
							$('#createMerchantDescription')
									.html('没有搜索到相关记录，确定使用<font style=\"color:red;\">'
											+ keyword + '</font>作为商家名称吗?');
							$('#createMerchant').modal();
						}
					}
				},
				error : function() {
					alert("服务器维护中，马上就好。");
				}
			});