2010-11-17 82 views
1

我使用的是jQuery Autocomplete Plugin(由jQuery的名人JörnZaefferer)。出现在jQuery中的jQuery UI图标自动完成结果

后端代码:

public JsonResult GetCompanyNames() 
    { 
     return Json(Model.CompanyNames); //returns valid JSon 
    } 

相关JS代码:

$('#CompanyName').autocomplete(['Suzuki', 'Honda', 'blah']); //This works fine 
$('#CompanyName').autocomplete('/Account/Login/GetCompanyNames'); //This renders icons! 

当通过JavaScript数组作为URL /数据参数为预计正常工作。

但是,当我通过Area/Controller/Action作为参数,它显示了jQuery的ui图标(呵呵?)在相应的文本框!!?

是的,我希望我可以附上截图。相信我,我仍然无法相信我的眼睛。

在调试时,我已验证我的方法返回了有效的JsonResult数据。我使用的是:ASP.NET MVC3,jQuery 1.4.2。我已在Chrome 6.0,IE8和Firefox 3.5中检查并发现相同的行为。更新:即使在自动完成请求从服务器返回之前,图标也会出现。

+1

为什么你使用bassistance.de插件,如果你已经使用jQuery UI?该插件不赞成使用jQuery UI版本。 – 2010-11-17 07:57:36

+1

我升级到jQuery UI的自动完成。(虽然并非没有困难,但它是值得的)。 – 2010-11-18 13:14:18

回答

1

确保允许GET请求:

public ActionResult GetCompanyNames() 
{ 
    return Json(Model.CompanyNames, JsonRequestBehavior.AllowGet); 
} 

另一个秘诀:使用FireBug,看看有什么确切地在客户端与服务器和任何可能的错误消息之间进行交换。


UPDATE:

的问题来自于你需要使用parseformatItem功能,因为该插件预期数据以一种特殊的方式被格式化为手动解析JSON的事实:

$('#CompanyName').autocomplete('/Account/Login/GetCompanyNames', { 
    dataType: 'json', 
    formatItem: function (data, i, max, value, term) { 
     return value; 
    }, 
    parse: function (data) { 
     return $.map(data, function (item) { 
      return { data: item, value: item, result: item }; 
     }); 
    } 
}); 
+0

@Darin:我确实尝试了以上,但仍然无效。控制台显示我这个错误消息:“Uncaught TypeError:对象没有方法'拆分'。” – 2010-11-17 07:42:17

+0

FireBug说什么?请求是否发送到服务器?服务器回应什么?你是否正在返回完全相同的JSON数组:从你的控制器动作中'[''Suzuki','Honda','blah']'还是一些复杂的对象?您的控制器操作应该像这样返回:'return Json(new [] {“Suzuki”,“Honda”,“blah”},JsonRequestBehavior.AllowGet);'。你看到:一个字符串数组。 Model.CompanyNames是字符串[]吗? – 2010-11-17 07:42:58

+0

是,请求被发送到服务器。服务器响应与预测一致。即。 Model.CompanyNames是一个字符串[]。 Firebug的控制台不给我警告/错误。响应标题包含Content-Type:application/json; charset = utf-8 Status:200 OK – 2010-11-17 07:51:56